javascript - 有 Angular 。将数据字典中的数据绑定(bind)到对象

Question

在 Angular 中，我的收藏很少。第一个是全局“产品属性”字典:

attributes : [
    {id:1, value:"red", type:"color"}, 
    {id:2, value:"green", type:"color"}, 
    {id:3, value:"big", type:"size"}
]

我有一个“产品”对象:

cars : [{
    name : "red big car",
    attributes : [1, 3] # id's corresponding to 'attributes' list
}]

现在在我的模板中，我想以简单的方式访问该数据:

<div ng-repeat='car in cars'>
    <p>{{ car.name }}</p>
    <p ng-repeat='attribute in attributes'>{{ attribute.value }}</p>
</div>

获取结果:

<div ng-repeat='car in cars'>
    <p>red big car</p>
    <p ng-repeat='attribute in attributes'>red</p>
    <p ng-repeat='attribute in attributes'>big</p>
</div>

我知道我可以迭代它并将所有“属性”数据复制到“汽车”，但这会产生大量无用的数据副本。还有其他想法吗？
预先感谢:)

Answer 1

如果没有干净的数学方法来计算基于 id 的数组索引(就像您当前的示例，其中索引为 (id-1))，那么我会创建一个查找表，它以与数据库通常相同的方式将数组索引值映射到 id 。就像这样:

$scope.lookup = {1:0,
                 2:1,
                 3:2 }

然后使用它将 car 属性数组索引映射到属性数组中的数组索引:

<div ng-repeat='car in cars'>
    <p>{{ car.name }}</p>
   {{car.attributes}}
   <p ng-repeat='indx in car.attributes'>{{attributes[lookup[indx]].value }}</p>
</div>

fiddle