Not a function error on TypeScript object after Casting

Question

I made an http call using Angular5 http client. In map function I have done the casting of the response to a PersonModel.

PersonModel has a function getFullName() which returns first_name + last_name

After doing the casting when I try to access this method on casted person object this shows an error of getFullName is not a function.

export class PersonModel {
constructor(
                public first_name: string = null,
                public middle_name: string = null,
                public last_name: string = null) {

    }

getFullName() {
        return this.first_name + this.last_name;
    }

}

This is the service

get(id: number): Observable<PersonModel> {
            return this.http.get("customer/" + id)
                .map((response: any) => {
                    return <PersonModel>response;
                });
        }


customerService.get(1).subscribe(result => {
    console.log(result.getFullName());
})

Error core.js:1350 ERROR TypeError: person.getFullName is not a function

Log for object:

{first_name: "kjlkj", last_name: "jnkjh"}

However when I create an object like this:

const person = new PersonModel();
person.first_name = "lkj";
person.last_name= "lkj";

then this logs as this:

PersonModel {first_name: "kjlkj", last_name: "jnkjh"}

@XyrinTechnologies Please post the full error too. The more information, the better. — Carcigenicate
– Carcigenicate, Commented Jan 19, 2018 at 17:29
@Carcigenicate found that ! : meta.stackexchange.com/questions/92060/… . Thanks again. Will clean my comments here in a minute. — Pac0
– Pac0, Commented Jan 19, 2018 at 17:31
@Carcigenicate Added, The complete info contains the file which wont be much useful to you :) — Xyrin Technologies
– Xyrin Technologies, Commented Jan 19, 2018 at 17:31

vinicius gati · Accepted Answer · 2019-11-14 21:08:29Z

8

Well , wellcome to JS/TS world.

When you cast basically it is just to avoid type "errors" on your IDE in typescript, and to be sure certain attributes exist on the object but not functions...

class Dog {
    public name: string = "";

    bark(): void {
        console.log("whoof whoof");
    } 
}


let johnny = new Dog();
johnny.name = "johnny";
johnny.bark(); // => Barks ok

let onlyattrs = {
    name: "err"
} as Dog;

// onlyattrs.bark(); // => function does not exists

let realDog = new Dog();
realDog = Object.assign(realDog, onlyattrs);

realDog.bark(); // => barks ok

Hope this helps.

answered Nov 14, 2019 at 21:08

vinicius gati

4395 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jrelo · Accepted Answer · 2018-01-19 18:19:13Z

0

Try this:

get(id: number): Observable<PersonModel> {
   return this.http.get('customer/' + id).pipe(
      map(p:any=> {return new PersonModel(p.first_name,p.middle_name,p.last_name)});
   );
}

edited Jan 19, 2018 at 18:19

answered Jan 19, 2018 at 17:43

jrelo

2381 silver badge11 bronze badges

4 Comments

FussinHussin Over a year ago

log what the get request is receiving so we can look at the object

Xyrin Technologies Over a year ago

@jrelo same issue, please check my last edits for description.

FussinHussin Over a year ago

I mean, log the http get, not your own object, I want to see what is comming through in the http request: console.log(response)

jrelo Over a year ago

you change your PersonModel to my implementation?

Collectives™ on Stack Overflow

Not a function error on TypeScript object after Casting

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related