कोणीय 2 http जेसन समस्या

Question

कोणीय 2 दृश्य में http जेसन प्रतिक्रिया प्रदर्शित करने का प्रयास कर रहा है। मुझे शुरू करने के लिए मैंने .NET कोर और कोणीय 2 के लिए टाइपस्क्रिप्ट के साथ एक विशिष्ट ट्यूटोरियल पूरा कर लिया है। सब ठीक काम किया, इसलिए मैंने इसे थोड़ा संशोधित करने की कोशिश की लेकिन ऐसा लगता है कि मैं अटक गया और जवाब नहीं मिला। अभी तक मेरे पास इतना ही है।

wall.main.component.ts

import {Component, OnInit} from "angular2/core"; 
import {CORE_DIRECTIVES} from "angular2/src/common/directives/core_directives"; 
import {WallService} from "./wall.service"; 

@Component({ 
    selector: "wall", 
    templateUrl: "app/components/wall/wall.main.html", 
    providers: [WallService], 
    directives: CORE_DIRECTIVES 
}) 
export class WallComponent implements OnInit { 
    data: any; 

    constructor(private service: WallService) { } 

    ngOnInit() { 
     this.get(); 
     console.log(this.data); 
    } 

    get() { 
     this.service.get().subscribe((json: any) => { 
      console.log(json); 
      this.data = json; 
     }); 
    } 
} 

wall.service.ts

import "rxjs/Rx" 
import {Http} from "angular2/http"; 
import {Injectable} from "angular2/core"; 

@Injectable() 
export class WallService { 
    constructor(private http: Http) { } 

    get() { 
     return this.http.get("wall/getwallposts").map(response => response.json()); 
    } 
} 

wall.main.html

<wall> 
    <p>{{data.Id}}</p> 
    <p>{{data.Body}}</p> 
</wall> 

एचटीएमएल डेटा प्रदर्शित नहीं करता है। त्रुटि:

TypeError: Cannot read property 'Id' of undefined in [{{data.Id}} in WallComponent@3:7] 

कई तरीकों से प्रयास किया। इंडेक्स डेटा के साथ सरणी के रूप में एक्सेस करना [0] आईडी, परिवर्तनीय प्रकार बदलना, कुछ भी नहीं। यह कंसोल.लॉग (जेसन) ठीक काम करता है। मैं कंसोल में ऑब्जेक्ट को देख और पढ़ सकता हूं, लेकिन दूसरा कंसोल.लॉग (this.data) अपरिभाषित दिखाता है, जिसे मैं वही होने की उम्मीद करता हूं। मैं क्या खो रहा हूँ?

Answer 1

सीडी शुरू होने पर, data.Id इंटरपोलेशन मूल्यांकन करने का प्रयास करता है, लेकिन data ऑब्जेक्ट अभी तक परिभाषित नहीं किया गया है। तो जब उसने Id संपत्ति को एक्सेस करने का प्रयास किया, तो यह एक त्रुटि फेंक दिया।

<wall> 
    <p>{{data?.Id}}</p> 
    <p>{{data?.Body}}</p> 
</wall> 

अन्य बात मैं बाहर बात करने के लिए है चाहता था, कोई अर्थ नहीं है, फिर wall तत्व के रूप में आप पहले से ही एक wall घटक प्रदान कर रहे हैं नहीं है। (मैं, पता है कि यह काम करने वाला नहीं है, क्योंकि हम प्रदान नहीं किया है यह Component की directives विकल्प)