Допомога у програмуванні, відповіді на питання / Javascript / Вкладене ng-repeat з масивом об'єктів, що містять масиви - javascript, angularjs, angularjs-ng-repeat

Вкладені ng-повтор з масивом об'єктів, що містять масиви - javascript, angularjs, angularjs-ng-repeat

Я не можу вкластися ng-repeat працювати для такої структури даних, як наступна:

options = [{name:"opt1", data:["a","b","c"]}, {name:"op2", data:["d","e","f"]}]

Я намагаюся створити тег вибору для кожного запису з опціями в ньому.

Я думав, що щось подібне повинно працювати:

<label ng-repeat="option in options">
<div>{{option.name}}</div>
<select>
<option ng-repreat="val in option.data">{{val}}</option>
</select>
</label>

але лише ім’я є ім’я друкується належним чином і створюється лише один варіант без значення

Потім я спробував використовувати track by $index у внутрішній ng-repeat:

<label ng-repeat="option in options">
<div>{{option.name}}</div>
<select>
<option ng-repreat="val in option.data track by $index">
{{option.data[$index]}}
</option>
</select>
</label>

але $index здається зовнішнім $index і підраховує лише від 0 до 1 із заданими даними.

Що я роблю неправильно?

Відповіді:

3 для відповіді № 1

вам слід використовувати ng-options замість ng-repeat, і за допомогою ng-моделі ви можете отримати вибране значення. Ось робочий код

angular.module("module", []).controller("mainCtr", ["$scope", function($scope){
$scope.options = [{name:"opt1", data:["a","b","c"]}, {name:"op2", data:["d","e","f"]}];
}]);

<!DOCTYPE html>
<html ng-app="module">

<head>
<link rel="stylesheet" href="style.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js">    </script>
<script type="text/javascript" src="script.js"></script>
</head>

<body ng-controller="mainCtr">
<div ng-repeat="option in options">
<div>{{option.name}}</div>
<select ng-model="opt" ng-options="opt for opt in option.data">
<option value="">--- select ---</option>
</select>
</div>
</body>
</html>