处理Angular 2中的奇怪问题.
如果您查看下面的组件,该服务将返回一个已解析的对象 – 例如我可以console.log它.您可以看到粘贴为注释的输出.每当我尝试在视图中使用所述对象时,我都会收到错误:EXCEPTION:TypeError:无法在SubjectHomeComponent @ 2:27中的[{{theData.subject}}中读取未定义的属性’subject’.
这对我来说没有意义,因为我可以在控制台中看到对象就好了.运行typeof也会返回它是一个对象.
组件代码
import { Component,View } from 'angular2/core' import { CORE_DIRECTIVES } from 'angular2/common' import {SubjectService} from "../../services/subject/SubjectService.ts"; import Rx from 'rxjs/Rx' import { Response } from 'angular2/http' import {ROUTER_PROVIDERS} from "angular2/router"; import {RouteParams} from "angular2/router"; @Component({ selector: 'subjectHomeComponent',providers: [SubjectService] }) @View({ template: ` Hello World <span>{{theData.subject}}</span> ` }) export class SubjectHomeComponent{ constructor(subjectService: SubjectService,params: RouteParams){ this.id = params.get('id') subjectService.getSubjectCardsAndNotes(this.id) .subscribe((res: Response) => { this.theData = res console.log(res) //returns {"subject":{"id":1,"name":"Spanish","created_at":"2016-01-23T06:54:50.321Z","updated_at":"2016-01-23T06:54:50.321Z"},"subject_id":1,"notes":[{"id":1,"title":"first note","body":"here i am!","created_at":"2016-01-27T03:10:09.238Z","updated_at":"2016-01-27T03:10:09.238Z","subject_id":1},{"id":2,"title":"first_note","body":"hello _buddy_","created_at":"2016-01-28T20:45:36.044Z","updated_at":"2016-01-28T20:45:36.044Z","subject_id":1}]} }); } }
服务代码(我认为这不相关但你永远不知道)
import {Injectable} from "angular2/core"; import {Http,HTTP_PROVIDERS,Response} from "angular2/http"; import Rx from 'rxjs/Rx' import 'rxjs/add/operator/map'; @Injectable() export class SubjectService{ constructor(public http: Http){ } getSubject(){ return this.http.request('/subjects.json') .map((response) => response.json()) } getSubjectCardsAndNotes(id){ return this.http.request(`subjects/${id}/subject_cards_and_notes.json`) .map((response) => response.json()) } }
尝试:{{theData?.subject}}或< span * ngIf =“theData”> {{theData.subject}}< / span>.
为什么会有很多重复的问题:
Angular 2: TypeError: l_thing0 is undefined in [{{thing.title}} in AppComponent@4:44]