AngularMaterial md-chips: не показывать выбранный элемент в <md-autocomplete>

Question

Я пытаюсь <md-autocomplete> пример отсюда md-chips

Для предотвращения попадания выбранных предметов внутрь <md-autocomplete> Я изменил функцию querySearch следующим образом:

function querySearch (query) {
    var results = query ? self.searchData.filter(createFilterFor(query)) : [];
    var finalResults = [];
    angular.forEach(results, function(result) {
        if($scope.selectedItems.indexOf(result.name) < 0) {
            finalResults.push(result);
            updateSelectedItems(result);    
         }
    });
    return finalResults;
}

Но моя проблема в том, что элемент управления не входит в эту функцию, когда мы выбираем элемент. Может кто-нибудь объяснить, пожалуйста, как решить эту проблему?

Answer 1

Я нашел решение из этой документации: md-autocomplete

Нам просто нужно добавить md-no-cache="true" для вызова querySearchфункционировать каждый раз, когда мы ищем элемент запроса

Answer 2

Решение, которое сработало для меня: md-no-cache="true" в md-autocomplete по-прежнему является обязательным условием для принудительной автозаполнения для повторной инициализации md-элементов; Md-chips должны иметь набор md-on-remove и md-on-append и быть реализованы так, чтобы удалить чип из списка или добавить чип в список;

Мой код выглядит примерно так: HTML:

 md-on-remove="removeTagChip($chip)"
 md-on-append="appendTagChip($chip)"

JS:

$scope.removeTagChip = function (chip) {
    var chipPos = $scope.getPosition(chip.Id, $scope.ChipTags);
    if (chipPos < 0) {
        $scope.ChipTags.push(chip);
    }
};
$scope.appendTagChip = function (chip) {
    var chipPos = $scope.getPosition(chip.Id, $scope.ChipTags);
    if (chipPos > -1) {
        $scope.ChipTags.splice(chipPos, 1);
    }
    return chip;
};

$ scope.getPosition просто возвращает позицию чипа в списке чипов;