角度2-无法读取带有上下文错误上下文的未定义错误的属性"0":[对象对象] [英] Angular 2 - Cannot read property '0' of undefined error with context ERROR CONTEXT: [object Object]
问题描述
我的服务就是这样
getRecords(): Observable<any>{
return this.http.get(this.fetchAdminData)
.map(this.extractData)
.catch(this.handleError);
}
,提取数据如下
private extractData(res: Response) {
let body = res.json();
return body || { };
}
在我的组件中,我称其为
In my component i am calling this as follows
import {Component, OnInit} from '@angular/core'
import {FormsHandler} from '../services/service.forms'
@Component({
selector: 'form-admin',
templateUrl: '../partials/form5.html'
})
export class FormAdminComponent implements OnInit {
public records
constructor(private formHandler : FormsHandler){
}
ngOnInit(){
this.formHandler.getRecords().subscribe(res => {
if (res.ok){
this.records = res.data
console.log(res)
console.log(this.records[0])
}
})
}
}
但是在html中按如下所示调用它时会出错
But when this is called on as follows in html it errors
{{records}} // this is working perfectly
{{records[0]}} //Cannot read property '0' of undefined ERROR CONTEXT: [object Object]
我什至无法访问这样的嵌套对象
also i even cannot access my nested object like this
<tr *ngFor="let record of records">
<td>{{record.firstName + " "+ record.middleName+ " "+ record.LastName}}</td>
<td>{{record.BankingDetails.company}} </td> // This results in errorTypeError: Cannot read property 'company' of undefined
<td>{{record.BankingDetails}} </td> //working fine but resulting in [object Object]
<td>Pending</td>
</td>
</tr>
导致TypeError:无法读取未定义的属性"company"
results in TypeError: Cannot read property 'company' of undefined
我的回答是这样的
Object {ok: true, data: Array[2]}
完整的数据是这样的:
[
{
"Address": {
"addressLine1": "nh" ,
"addressLine2": "nghn" ,
"city": "ngh" ,
"formStatus": 2 ,
"pinCode": "ngh" ,
"state": "nghn"
} ,
"BankingDetails": {
"bankName": "csdcss" ,
"company": "cd" ,
"designation": "kn" ,
"loanAmount": "csd" ,
"loanPurpose": "cs" ,
"panCardNumber": "84894848" ,
"salary": "55"
} ,
"contact": "vsd" ,
"date": "vsd" ,
"dob": Mon Jan 01 1 00:00:00 GMT+00:00 ,
"email": abhishek@gmail.com, »
"firstName": "cs" ,
"firstname": "" ,
"formStatus": 3 ,
"gender": "male" ,
"id": "98fd72b9-62fe-4fcd-90d6-f2a5f83c052b" ,
"isAdmin": 1 ,
"lastName": "vs" ,
"lastname": "" ,
"middleName": "vds" ,
"middlename": "" ,
"month": "vsd" ,
"password": <binary, 60 bytes, "24 32 61 24 31 30..."> ,
"username": "" ,
"year": "vs"
},
...
]
我没有做错什么,因为它可以在console.log上正常工作并打印一个json,但是无法通过html进行访问
i did't getting what am i doing wrong becuase its working fine with console.log and printing a json but is not accessible with html
我也注意到当我使用
{{records}}
其产生[object Object]
its resulting in [object Object]
我必须明确地写
{{records | json}}
获取我的完整数据
嘿,请告诉我我在做什么错,我想访问我的嵌套元素,例如records.BankingDetails.company
Hey please suggest me what i am doing wrong i want to access my nested elements like records.BankingDetails.company
推荐答案
根据@Akshay Rao的建议,我终于找到了解决此问题的方法 我使用了这些,以便在呈现页面
I finally got a solution to this problem as per @Akshay Rao suggestions i used these so that data is available before rendering of page
<div *ngIf="records">
</div>
也按照@GünterZöchbauer的建议,我确实需要使用像(Elvis)这样的运算符
also as per @Günter Zöchbauer suggestion i do require to use (Elvis) operator like
{{record.BankingDetails?.company}}
,效果很好. 谢谢
这篇关于角度2-无法读取带有上下文错误上下文的未定义错误的属性"0":[对象对象]的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!