Within my Angular framework, I am managing several collections. One of these is a global 'product attribute' dictionary:
attributes : [
{id:1, value:"red", type:"color"},
{id:2, value:"green", type:"color"},
{id:3, value:"big", type:"size"}
]
Additionally, I have a 'product' object:
cars : [{
name : "red big car",
attributes : [1, 3] # referencing ids in the 'attributes' list
}]
Now, in my template, I aim to easily access this data:
<div ng-repeat='car in cars'>
<p>{{ car.name }}</p>
<p ng-repeat='attribute in attributes'>{{ attribute.value }}</p>
</div>
This code will yield:
<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>
I understand that manually copying all attribute data to each 'car' object would result in redundant copies. Do you have any alternative suggestions? Thanks in advance :)