Http获取Angular 2，读取json

我试图从api中获取JSON数据，并使用angular 2显示其内容。 对话部分：

export class ConversationComponent implements OnInit {
    public conversation: any;

    constructor(private conversationsService: ConversationsService,
                private routeParams: RouteParams) { }


    ngOnInit() {
        let id = +this.routeParams.get('id');
        this.conversationsService.getConversation(id)
            .subscribe(
            con => this.conversation = con,
            error => console.log(this.conversation)
            )
    }
}

通信服务：

@Injectable()
export class ConversationsService {

    private url = 'https://dev4.aldensys.com/PrometheusWebAPI/api/Conversations/';
    private token = this.storageService.getAuthorizationToken();

    constructor(private http: Http, private storageService: StorageService) { }

    getConversation(id: number) {
        var headers = new Headers();
        headers.append('Authorization', 'Bearer ' + this.token);
        var options = new RequestOptions({ headers: headers });
        return this.http.get(this.url + id, options)
            .map(res => res.json())
            .catch(this.handleError);
    }

    private handleError(error: any) {
        let errMsg = (error.message) ? error.message :
            error.status ? `${error.status} - ${error.statusText}` : 'Server error';
        console.error(errMsg); // log to console instead
        return Observable.throw(errMsg);
    }
}

由于某些原因，此.conversation未定义。在我将响应映射到服务文件上的json之后，我试图立即提醒响应：它显示“object:object”

---

任何帮助都将不胜感激。

我明白了。您的问题是，模板在数据进入之前显示错误

用这个

{{conversation？.number}

在Angular2中，与Angular1相比，这是不可原谅的

---

这是

中的参考，你说的未定义是什么意思？您的意思是从这一行

error=>console.log（this.conversation）

？在*.component.html文件上，我试图显示

{{conversation.number}

。这就是它说对话未定义的地方。如果我将

{{{conversation.number}}

更改为

{{（conversation）？conversation.number:“}}}

，它会工作。但是，应该有比这更好的解决方案。这很有帮助，非常感谢。我实际上使用了

*ngIf='conversation'

，所以我不必编辑引用对话的每一行。[属性]。