0
У меня есть выбор, который использует ng-options. Выбранное значение этого параметра заполняет список ng-repeat, используя фильтр. Теперь мне нужно добавить класс к некоторым элементам списка ng-repeat. У меня есть идентификатор элементов списка, к которому должен быть добавлен класс, в массиве.Динамическое выделение класса для элементов ng-repeat с опциями ng-options
HTML код:
<select class="form-control" ng-options="car.BaseStation as car.BaseStation for car in UnUsedCars | unique: 'BaseStation' | orderBy:'BaseStation'" ng-model="selected.BaseStation" ng-change="locationChanged()">
<option value="">All Locations</option>
</select>
<h3>Select Car</h3>
<ul class="cablist">
<li ng-repeat="unUsedCar in UnUsedCars | filter: selected.BaseStation" id="{{unUsedCar.Id}}">
<div class="cardetails">
<h4>{{unUsedCar.CarType}}</h4>
</div>
</li>
</ul>
JS
<script data-require="[email protected]*" data-semver="0.4.0" src="http://rawgithub.com/angular-ui/angular-ui/master/build/angular-ui.js"></script>
<script type="text/javascript">
var carApp = angular.module('carApp', ['ui.directives','ui.filters']);
carApp.controller('CarCtrl', ['$scope', function(scope) {
scope.locationChanged = function() {
arrayLength = scope.carArray.length; //scope.carArray is the array of li element Id on which class "selected" is to be added.
for(i = 0; i < arrayLength; i++) {
var carId = scope.carArray[i];
document.getElementById(carId).className += " selected";
}
}
}]);
Пример массива данных
[{
"Id" : "1",
"CarType" : "Audi",
"BaseStation" : "Canada"
},
{
"Id" : "2",
"CarType" : "BMW",
"BaseStation" : "U.S.A"
},
{
"Id" : "3",
"CarType" : "Benz",
"BaseStation" : "Canada"
}]
scope.carArray например данные
["2","3"]
Когда я выбираю другое местоположение из select с ng-options, мой js предполагает добавить класс «selected» к элементам li, который имеет свои идентификаторы в области scope.carArray. Он несколько раз работает, но чаще всего он падает. Какие ошибки я здесь сделал?