Я использую выпадающий список начальной загрузки, чтобы отфильтровать длинный список элементов для операции множественного выбора.
Код генерирует элемент управления следующим образом:
![typeahead with checklist](https://i.stack.imgur.com/crrks.png)
Хотя я могу захватить отмеченные элементы с помощью атрибута typeahead-on-select для запуска функции, которая захватывает выбранные элементы, я не могу заставить сами флажки отображаться отмеченными на отмеченных элементах.
Это HTML
<div id="choose-classes">
<input placeholder="Select other Quickbooks classes"
typeahead-editable="false"
uib-typeahead="myitem.name for myitem in otherClasses | filter:$viewValue" class="form-controller"
typeahead-template-url="addClassTemplate.html"
typeahead-on-select="onSelect($item, $model, $label, $event)"
ng-model="dummy"/>
</div>
<script type="text/ng-template" id="addClassTemplate.html">
<span class="add-class-check">
<input type="checkbox" ng-checked="isChecked(match-label)" >
<span ng-bind-html="match.label | uibTypeaheadHighlight:query</span>
</script>
То, что кажется ошибочным, заключается в том, что по какой-то причине код, прикрепленный к ng-check в шаблоне элемента ввода thw, фактически никогда не срабатывает. Я поставил отладчик там, функция, кажется, не вызывается. Предполагая, что это может быть потому, что он находится в шаблоне и, возможно, не имеет доступа к контроллеру, но не может понять, как правильно установить этот флажок, даже если я знаю, какие элементы проверяются.
$scope.otherSelectedClasses={};
$scope.otherSelectedClasses.classNames = {};
$scope.isChecked = function(otherName) {
debugger;
let val= $scope.otherSelectedClasses.classNames[otherName];
return val;
};
$scope.myvalue = true;
$scope.onSelect = function (a, b, c, d) {
toggle(a.name);
$scope.dummy="";
};
function toggle(name) {
let list = $scope.otherSelectedClasses.classNames;
if (name in list) {
list[name] = !list[name];
} else {
list[name] = true;
}
}