httpのマッピング結果がnullのオブジェクトで返されます。

Question

バックエンドのgetTestメソッドに対してhttpリクエストを行っています。タータデータはシオマネキを使用してテストサーバーから返さ：

{ 
    "number": "1a", 
    "testId": 1, 
    "testNumber": 5, 
    "testDate": "2016-05-20T00:00:00", 
    "assignedPupils": [], 
    "unAssignedPupils": [] 
} 

何かが加入するかというと間違っている - ので、私は仮定 - .MAP機能ではなく、私はわかりません。マッピングをデバッグしようとすると、EditTestクラスには決して行きません：そして、エラーメッセージは、バインドされたhtmlのエラーを示しています。これは遅すぎます。私は 'テスト'オブジェクトが定義されていないことを知る必要があります！

誰もがこの問題を認識していますか？

export class EditTestComponent implements OnInit { 
    test: EditTest; 

    constructor(
     private _testsService: TestsService, 
     private _routeParams: RouteParams) 
    { } 

    ngOnInit() { 
     let id = this._routeParams.get('id'); 
     this._testsService.getTest(id).subscribe(test => this.test = test.map(t => new EditTest(t))); 
    } 

} 


TestService.ts: 

getTest(id) { 
     return this.http.get('api/tests/edit/' + id).map(res => res.json()); 
    } 

HTML：

<div> 
    <label>id: </label>{{test.id}} 
    <label>number: </label>{{test.number}} 
    <label>date: </label>{{test.date}} 
</div> 

私はこの例外を取得：

XCEPTION: TypeError: Cannot read property 'id' of undefined in [{{test.id}} 
     in EditTestComponent@3:27] 

Answer 1

testがバックエンドから割り当てられた値を取得する前に、あなたは{{test.id}}を参照しています。このエラーは実際にスクリプトの実行を停止し、mapに到達しません。この問題を克服するために、Angular.io cheat sheetからエルビス演算子?

を使用します（？）

は

<p>Employer: {{employer?.companyName}}</p>
安全運航事業者は、雇用者フィールドがオプションであることを意味し、未定義の場合は、式の残りの部分はすべき無視される。

はこのようにそれを使用します。

<div> 
    <label>id: </label>{{test?.id}} 
    <label>number: </label>{{test?.number}} 
    <label>date: </label>{{test?.date}} 
</div> 

また、あなたはEditTestのコンストラクタを示さなかったので、私はそれがプロパティを取り、それらを割り当てると仮定します。