我无法访问指令内的ng-repeat项目

Question

我对Angular有一个问题。我最近才开始使用Angular，所以我不知道还有什么需要知道的。我正在使用 AGM （Angular Google Maps） ，我正在尝试将标记添加到地图中，如下所示：

<agm-map> ... </agm-map>

内

<agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>

这是有效的。但是，当我尝试从我的component.ts中的数据列表中动态添加标记时，它表示无法读取...来自undefined。

<agm-marker *ngFor="let item in data" [latitude]="item.point_lat" [longitude]="item.point_lng"></agm-marker>

我猜不能像这样访问 item 。但我无法弄清楚它应该如何......

编辑：当我运行时，数据显示为预期。

<tr *ngFor="let item of data">
    <th>{{item.point_lat}}</th> //51.34454736511800 
    <td>{{item.point_lng}}</td> //4.32184512840880
</tr>

Answer 1

Shadowlauch和OP的解决方案。

item.point_lat ＆amp; item.point_lng 是字符串。虽然 <agm-marker> 需要数字。我在component.ts中编写了一个函数

stringToNumber(val: number) {
    return Number(val);
}

并将字符串转换为数字，如：

<agm-marker *ngFor="let item of data" [latitude]="stringToNumber(item.point_lat)" [longitude]="stringToNumber(item.point_lng)"></agm-marker>