Angular 4：具有构造函数的类作为 http Observable 模型

【问题标题】：Angular 4: Class with constructor as http Observable modelAngular 4：具有构造函数的类作为 http Observable 模型
【发布时间】：2018-04-20 23:33:04
【问题描述】：

在我的应用程序中，我有一个定义为带有构造函数的类的模型。像这样：

export class Movie {
    title: string;
    posterURL: string;
    description: string;

    public constructor(cfg: Partial<Movie>) {
        Object.assign(this, cfg);
    }

    getEndDate(): Date {
        return new Date();
    }
};

我也有一个使用这个模型的 HTTP 请求

getMoviesData(): Observable<Movie[]> {
    return this.http.get<Movie[]>(`http://localhost:3544/movies`)
}

果然不行

我该如何解决这个问题？我还应该创建一个界面还是什么？

感谢您的帮助:)

【问题讨论】：

标签： angular typescript

【解决方案1】：

HttpClient 方法是通用的，this.http.get<Movie[]> 断言结果符合Movie[] 接口并且不创建Movie 实例。

为了使结果成为类实例，应显式实例化该类。类构造函数最好接受普通对象，哪些属性将分配给类实例，Movie 已经使用cfg 参数做到了这一点。

由于Partial<Movie> 类型不太可能精确描述接口，因此最好声明一个单独的接口：

interface IMovie {
    title: string;
    posterURL: string;
    description: string;
}

class Movie implements IMovie { ... }

...

getMoviesData(): Observable<Movie[]> {
    return this.http.get<IMovie[]>(...)
    .map(plainMovies => plainMovies.map(plainMovie => new Movie(plainMovie)))
}

【讨论】：