Как я могу добавить отдельную ширину каждое имя и значение, которые становятся повторными Нг-повтор

Question

Как я могу добавить отдельный width к каждому имени и значения, которые становятся итерированным по:

ng- повторить в angularJS

Для, например: Это мои данные:

[ 
{ 
    "name": "First Name", 
    "value": "Harry" 
}, 
{ 
    "name": "Last Name", 
    "value": "Potter" 
}, 
{ 
    "name": "Gender", 
    "value": "Male" 
}, 
{ 
    "name": "DOB", 
    "value": "21/5/1988" 
}, 
{ 
    "name": "SSN", 
    "value": "298456147" 
}] 

HTML:

<div> 
 
    <div ng-repeat=\ "data in data\"> 
 
    <div style=\ "float:left\">{{data.name}}</div> 
 
    <div style=\ "float:left\">{{data.value}}</div> 
 
    </div> 
 
</div>

Таким образом, для каждого имени и значения мне нужно отдельное width.

Где можно добавить свойства ширины?

Answer 1

Добавьте предложение «track by $ index», как описано в документах для ng-repeat.

ng-repeat="opt in data track by $index"

Затем вы можете использовать {{opt.name}} и {{}} opt.value и поместить их в различных HTML элементов с отдельными стилями.

Answer 2

Вы можете создать массив из ваших возможных ширин как

$scope.widthArray = ['100px','300px','200px'] 

Затем установить ширину, как показано ниже в нг-повтора на элементе

ng-style="{width: widthArray[$index]}" 

Вы можете организовать ваши ширины согласно вашему требованию в массиве ,