Angular2错误无法读取属性

问题描述：

我有一个创建对象的方法函数。我在这里的功能Angular2错误无法读取属性

packetdata:any[]; 

ngOnInit() { 
    this.service.getonepacket(this.nopacket).subscribe(
     data => { 
      return this.packetdata = data; 
     }, 
     error => console.log(this.errorMessage = <any>error) 
    ) 
    }

如果我使用控制台日志this.packet就会导致物体像这样

Object {idpacket: 3, packetname: "Packet C", packetdesc: "SMS 20 sms/hari, Storage 20Gb", packetprize: "Rp. 300.000/bulan", packettime: 30}

我试图把那对我的表中的每个值这样

<h3 class="page-header">Your Bill Information</h3> 
<table class="table table-striped"> 
    <tr> 
    <th *ngFor="let item of packetdata"> Packet Name </th> 
    <td>{{item.packetname}}</td> 
    </tr> 
    <tr> 
    <th *ngFor="let item of packetdata"> Description </th> 
    <td> {{item.packetdesc}} </td> 
    </tr> 
    <tr> 
    <th *ngFor="let item of packetdata"> Prize </th> 
    <td> {{item.packetprize}} </td> 
    </tr> 
    <tr> 
    <th *ngFor="let item of packetdata"> Minimal Contract time (day) </th> 
    <td> {{item.packettime}} </td> 
    </tr> 
</table>

但它返回错误错误无法读取属性。
如何解决这个问题？

请发布确切的错误信息。 –

像那个先生@GünterZöchbauer 错误：./BillComponent类中的错误BillComponent - 内联模板：5：8引起的：无法读取未定义的属性'packetname' – dedypuji

答

<th *ngFor="let item of packetdata"> Packet Name </th> 
<td>{{item.packetname}}</td>

不能工作

item只有<th>（已申请了*ngFor指令元素）包中可用名称{{item.packetname}}

您可能需要

<ng-container *ngFor="let item of packetdata"> 
    <th> Packet Name </th> 
    <td>{{item.packetname}}</td> 
</ng-container>

我使用你的坐下来更改我的代码。但它又出现错误 – dedypuji

无法找到类型为'object'的不同支持对象'[object Object]'。 NgFor仅支持与阵列等Iterables绑定。 – dedypuji

查看https://*.com/questions/41396435/how-to-iterate-object-object-using-ngfor-in-angular-2/41396558#41396558 –

答

尝试更换ngFor到<td>这样的：

<tr> 
    <th > Packet Name </th> 
    <td *ngFor="let item of packetdata">{{item.packetname}}</td> 
</tr>

答

将* ngIf =“packetdata”添加到标记表并删除de订阅中的返回。

Angular2错误无法读取属性

相关推荐