转换后不是 TypeScript 对象的函数错误

Question

我使用 Angular5 http 客户端进行了 http 调用。 在 map 函数中，我已经完成了对 PersonModel 的响应的转换。

PersonModel 有一个函数 getFullName() 返回 first_name + last_name

当我尝试在强制转换的 person 对象上访问此方法进行强制转换后，这显示 getFullName 不是函数的错误。

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;
    }

}

这是服务

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());
})

错误core.js:1350 错误类型错误：person.getFullName 不是函数

对象的日志：

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

但是，当我创建这样的对象时：

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

然后记录如下：

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

Answer 1

好吧，欢迎来到 JS/TS 世界。

当您基本上进行转换时，只是为了避免在打字稿中的 IDE 上键入“错误”，并确保对象上存在某些属性而不是函数...

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 

希望这会有所帮助。

Answer 2

试试这个：

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)});
   );
}