CODEWITHSUNDEEP
javascriptangulartypescripthttpangular6
cbrawl
cbrawl

Reputation: 985

TypeError: map is not a function

I am trying to make a POST call to the API and am receiving the error in the title. I have checked all other related questions and have made sure it is none of those issues. I have imported the rxjs map operator. In fact, I am using this exact same syntax in hundreds of other http calls in my front-end Angular 6 application without a problem.

Here is the code snippet causing an issue:

public createMap(map) {
    map.companyId = this.company.getCompanyId();
    const temp = this.json.clone(map);
    temp.settings = this.json.manageJSON(temp.settings, true);

    return this.authHttp.post(environment.coreApiPath + 'importMaps', temp)
        .pipe(map((res: any) => {
            map.ID = res.ID;
            map.tempName = null;
            this.maps.push(map);
            return map;
        }),
        catchError(error => { throw Error('Custom Error: There was an error when attempting to create this import map.') }));
}

The error is on the line that reads .pipe(map((res: any) => {

Any idea what could be causing this issue?

Here are my imports just in case you're wondering:

import { HttpClient } from '@angular/common/http';
import { map, catchError } from 'rxjs/operators';

Upvotes: 1

Views: 1222

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1075755

Your parameter map is shadowing your imported map:

import { map, catchError } from 'rxjs/operators';
//       ^^^------------------- import

// ...

public createMap(map) {
//               ^^^----------- parameter

So within createMap, you can't use the imported map; it's inaccessible.

Consider either renaming the parameter, or renaming the import.

Upvotes: 6

Related Questions