Question

如何绑定此数据

    export const CEK: Cek[] = [
  {
    id : 1,
    name : 'one',
    arr : [{lat : 123, long:3212}]
  },
  {
    id : 2,
    name : 'two',
    arr : [{lat : 123, long:3212}]
  },
];

我试着像这样绑定数据

<tr *ngFor="let data of datacek">
        <td> {{data.id}} </td>
        <td> {{data.name}}</td>
        <td> {{data.arr[lat]}} {{data.arr[long]}} </td>
    </tr>

^ data.arr [lat]或data.arr [lat]没有显示任何内容

或者我试过这种方式

<tr *ngFor="let data of datacek">
        <td> {{data.id}} </td>
        <td> {{data.name}}</td>
        <td> {{data.arr}}</td>
    </tr>

，结果只显示[object Object]

任何想法如何绑定我的数据案例？

Answer 1

将arr属性用作对象，然后它将与您现有的模板一起使用。

export const CEK: Cek[] = [
  {
    id : 1,
    name : 'one',
    arr : {lat : 123, long:3212}
  },
  {
    id : 2,
    name : 'two',
    arr : {lat : 123, long:3212}
  },
];

否则使用arr 数组

的索引

<td> {{data.arr[0].lat}} {{data.arr[0].long}} </td>

您将属性声明为数组并将其用作对象。这就是问题所在。

Answer 2

它应该是：

<td> {{data.arr[0].lat}} {{data.arr[0].long}} </td>

Answer 3

使用以下代码：

<tr *ngFor="let data of datacek">
    <td> {{data.id}} </td>
    <td> {{data.name}}</td>
    <td> {{data.arr[0].lat}} {{data.arr[0].long}} </td>
</tr>

让我知道它是否解决了您的问题。

角度绑定数据对象的数组

3 个答案: