我有一個這樣的選擇倍數
<select
id="countries"
ng-model="country"
ng-options="option.name for option in countryOptions track by option.id"
multiple>
</select>
填充這個選擇我正在做：
let countries = [];
countries.push({
id: country.id,
name: country.name,
selected: false
});
$scope.countryOptions = countries;
然后作用于另一個元素，我回圈 scope.countryOptions 以檢查它的任何元素是否在另一個陣列中，在這種情況下，我將它們標記為選中：
$scope.countryOptions.forEach((country, index) => {
$scope.countryOptions[index].selected = activeCountries.indexOf(country.id) !== -1;
});
我應該怎么做才能在選擇多個（在 UI 中）中突出顯示選定的元素？
uj5u.com熱心網友回復：
您的資料源$scope.countryOptions和用戶選擇的國家$scope.country不同。保持您的資料源純凈并單獨跟蹤用戶選擇。
angular.module('selectExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.countryOptions = [{ id: 1, name: "Brazil" },
{ id: 2, name: "France" },
{ id: 3, name: "Djibouti" }
];
let activeCountries = [1, 3]
// init
$scope.country = $scope.countryOptions.filter(c => activeCountries.indexOf(c.id) > -1)
}]);<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.10/angular.min.js"></script>
<div ng-app="selectExample">
<div ng-controller="ExampleController">
<select id="countries" ng-model="country" ng-options="option.name for option in countryOptions track by option.id" multiple>
</select>
<hr> {{country}}
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/520420.html