对象属性在HTML模板中触发错误

Question

我正在使用http请求返回Angular2应用中的单个对象。该对象似乎返回正常但在我的视图中无法访问该对象的属性。

我的服务电话：

  getSession(title) {
    return this.http.get('http://localhost:3000/session')
      .map((response: Response) => {
        const session = response.json().obj.find(session => session.title.toLowerCase() === title);
        return session;
      })
      .catch((error: Response) => Observable.throw(error.json));
  }

回归

 ngOnInit() {
    this.sub = this.route.params.subscribe(params => {
      this.title = params['title'];
    });

    this.sessionService.getSession(this.title)
      .subscribe(
        session => {
          this.session = session
          console.log(this.session)
        });
  }

对象正在被记录并且看起来很好但是我在返回时遇到了一个打字稿错误，说我的会话模型不能分配this.session。 Type '{}' is not assignable to type 'Session'

这让我相信HTTP返回对象可能嵌套在另一个对象中，所以我尝试在我的服务中创建一个新会话，在那里分配所有值并返回该类，但它似乎仍然有同样的问题。

  getSession(title: string) {
    return this.http.get('http://localhost:3000/session')
      .map((response: Response) => {
        const session = response.json().obj.find(session => session.title.toLowerCase() === title);
        console.log(session)
        let transformSession = (new Session(session.title, session.date, session.description, session.imageUrl, session.featuredSession, session.audioUrl, session.tracklist, null, null));
        return transformSession;
      })
      .catch((error: Response) => Observable.throw(error.json));
  }

在使用Session类构建对象之前，在我的服务中记录第一个对象，第二个对象记录在我的组件中。它们似乎都有效但我无法访问其中任何一个的属性。

如果我使用{{session | json}}，则会打印此

但是如果我尝试{{session.title}}我得到一个标题的返回错误是未定义的。

我错过了什么吗？我一直在使用本地JSON文件构建我的所有应用程序，这是我的第一个带服务器的Angular应用程序。

由于

Answer 1

HTTP不知道你将从服务器获得什么，它可能是Session，Product，User ......所以它为它分配了通用的Object类型。另一方面，Typescript期望Session，因为你声明了session: Session并且因为它而给你这个错误。

您可以通过告诉它知道方法返回某种类型来帮助打字稿编译器：

getSession(title): Session {
  ...
}

或

  .subscribe(
    (session: Session) => {...});