The argument with type 'void' cannot be assigned to a parameter with type 'Action'

Question

The argument with type 'void' cannot be assigned to a parameter with type 'Action'

Just getting started with Typescript and using VSCode.

Encountering the following Error:

*[ts] Argument of type 'void' is not assignable to parameter of type 'Action'. (parameter) action: void

Here is the code snippet causing the error:

  loadItems() {
    return this.Apiname.find()
        .map(
        (data) => console.log("data:", data)
        )
        .map(
        payload => ({
            type: 'LOAD_ITEMS',
            payload: payload
        },
        )
        )
        .subscribe(
        action => this._store.dispatch(action)//Error
        );
};

Any assistance would be greatly appreciated.

typescript visual-studio-code

Answer 1

Answer №1

Your map function may be causing issues due to a trailing comma. Consider modifying your code as shown below:

return this.Apiname.find()
    .do( (data) => console.log("data:", data) )
    .map(
        payload => ({
            type: 'LOAD_ITEMS',
            payload: payload
        })
    )
    .subscribe(
        action => this._store.dispatch(action) // no error
    );

The action variable is now of type { type: string, payload: ... }

NOTE: To perform side effects like logging with console.log, utilize the .do operator provided by ReactiveX - check out http://reactivex.io/documentation/operators/do.html

Answer 2

Your map function may be causing issues due to a trailing comma. Consider modifying your code as shown below:

return this.Apiname.find()
    .do( (data) => console.log("data:", data) )
    .map(
        payload => ({
            type: 'LOAD_ITEMS',
            payload: payload
        })
    )
    .subscribe(
        action => this._store.dispatch(action) // no error
    );

The action variable is now of type { type: string, payload: ... }

NOTE: To perform side effects like logging with console.log, utilize the .do operator provided by ReactiveX - check out http://reactivex.io/documentation/operators/do.html

The argument with type 'void' cannot be assigned to a parameter with type 'Action'

Answer №1

Similar questions

Angular 4 is unable to attach to 'formGroup' as it is not recognized as a valid property of 'form'

Tips for iterating over an array that implements either of two interfaces in TypeScript

The canActivate: [AuthGuard] feature on the external router is not functioning as expected

Change typescript so that it shows "require" instead of "import" when outputting

What is the significance of TypeScript's dual generic typing feature?

Retrieving information using React Query in TypeScript

Store the selected checkbox values in an array when submitting in Ionic

When HTMLElement focus is activated, it interrupts the flow of execution

What could be causing the error when my file is running?

Loading screen displayed while transitioning between routes within Angular

Angular page not reflecting show/hide changes from checkbox

Tips on creating a Jasmine unit test scenario for a function that triggers onerror of an image tag

What is the best way to transfer a variable from an @Input property to a service within an Angular2 component?

Testing Angular HTTP error handlers: A comprehensive guide

Issue with Angular 4: Mega menu does not automatically close when a menu item is selected from within it

In Angular 11, the error message "Type 'Object' cannot be assigned to type 'NgIterable<any> | null | undefined'" is appearing

Transforming the unmanaged value state of Select into a controlled one by altering the component

"Why is it that the onChange method of the antd table does not return an array of numbers for selectedRowKeys

Error in ReactJS VSCode while integrating Cypress testing: The name 'cy' cannot be found

What is the best way to increase a JSON value in a Typescript scenario? For instance, how can I add more