2017-05-10 19 views
0

我在角2接口如下 -不能結合數據從對象以查看在角2

export interface ContactInformationModel { 
    EmailAddress : string; 
    DirectPhone : string; 
    Extension : string; 
    DirectFax : string; 
    RemoteFax : string; 
    PersonalEmail : string; 
    HomePhone : string; 
    CellPhone : string; 
    Birthday : string; 
    Address : string; 
    PrimaryEmergencyContact : string; 
    PrimaryEmergencyContactCellPhone : string; 
    SecondaryEmergencyContact : string; 
    SecondaryEmergencyContactCellPhone : string; 
} 

我在我的服務中的一個服務的方法如下: -

public getContactInformation(Id: any): Observable<ContactInformationModel> { 
     console.log('Service - ContactService - Method - getContactInformation - Params - Id : ' + Id); 
     this._requestOptions = new RequestOptions({ 
      method: RequestMethod.Post, 
      url: this.contactInformationUrl, 
      headers: this.headers, 
      body: JSON.stringify(Id) 
     }); 
     console.log('POST Query for Contact Information : ' + JSON.stringify(this._requestOptions)); 
     return this._http.request(new Request(this._requestOptions)).map(this._httpExtractDataService.extractData).catch(this._httpErrorHandlerService.handleError); 
} 

我打電話從我的組件的服務如下 -

//Get Contact Information 
this._employeeFilesService.getEmployeeContactInformation(this.selectedEmployeeId).subscribe(
    data => this.contactDataItem = data, 
    error => this._errorLoggerService.logError(error, "Contact Information Component"), 
    () => console.log('Contact Information Received In Information Component -' + JSON.stringify(this.contactDataItem))); 

哪裏contactDataItem的類型是聯繫的變量信息模型,聲明如下 -

contactDataItem : ContactInformationModel; 

當我運行應用程序,我可以在該服務已返回一個對象,看起來像下面控制檯中看到 -

{ 
    "EmailAddress":"[email protected]", 
    "DirectPhone":"000-000-0000", 
    "Extension":"0000", 
    "DirectFax":"000-000-0000", 
    "RemoteFax":"000-000-0000", 
    "PersonalEmail":"[email protected]", 
    "HomePhone":"000-000-0000", 
    "CellPhone":"000-000-0000", 
    "Birthday":"2017-05-10", 
    "Address":"My Address", 
    "PrimaryEmergencyContact":"Contact Person Name", 
    "PrimaryEmergencyContactCellPhone":"000-000-0000", 
    "SecondaryEmergencyContact":"Contact Person Name", 
    "SecondaryEmergencyContactCellPhone":"000-000-0000" 
} 

,但是當我試圖綁定這個對象的屬性對我的表,然後它不會被綁定。

<tbody> 
    <tr><td><b>Email Address</b></td><td>{{contactDataItem?.EmailAddress}}</td></tr> 
    <tr><td><b>Direct Phone</b></td><td>{{contactDataItem?.DirectPhone}}</td></tr> 
    <tr><td><b>Extension</b></td><td>{{contactDataItem?.Extension}}</td></tr> 
    <tr><td><b>Direct Fax</b></td><td>{{contactDataItem?.DirectFax}}</td></tr> 
</tbody> 

而且,請注意,當我只是分配一個硬編碼對象變量contactDataItem並將其綁定到當時綁定是全成。 我在做什麼錯?任何幫助,將不勝感激。

感謝, 阿米特阿南德

+0

沒有給出什麼錯誤? –

+0

錯誤是「無法找到不同的支持對象」 –

回答

0

你可以嘗試訪問數據屬性。

getMovie(id: number): Observable<IMovie> { 
    const url = `${this.moviesUrl}/${id}`; 
    return this.http.get(url) 
     .map((res: Response) => { 
      const body = res.json(); 
      return <IMovie>body.data || {}; 
     }) 
     .do(data => console.log(JSON.stringify(data))) 
     .catch(this.handleError); 
} 

從角文檔:

不要指望解碼JSON直接成爲英雄陣列。此 服務器始終將JSON結果封裝到具有數據屬性的對象中。 你必須解開它才能得到英雄。這是傳統的Web API 行爲,受安全問題驅動。

https://angular.io/docs/ts/latest/guide/server-communication.html

+0

沒有幫助使用data.data。事實上,我這樣做的時候,它顯示了另一個錯誤是 「屬性數據類型上ContactInformationModel不存在」 –

+0

OK,我有它在我的答案錯了地方。它應該在服務中。我修正了上面的答案,但不確定你的'extractData'看起來像什麼,所以我只是從我的一個應用程序粘貼了代碼。 – DeborahK

+0

這是提取數據的樣子 ExtractData由(RES:響應|任何){ 讓體= res.json(); return body || {}; } –