Angular Material md-chips:不在 <md-autocomplete> 中显示所选项目
AngularMaterial md-chips : Dont show selected item in <md-autocomplete>
我正在尝试此处的 <md-autocomplete>
示例 md-chips
为了防止 selected 项进入 <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;
}
但我的问题是,一旦我们 select 一个项目,控件就不会进入这个函数。有人可以解释一下如何解决这个问题吗?
我从这个文档中找到了解决方案:md-autocomplete
我们只需添加md-no-cache="true"
,用于每次搜索查询项时调用querySearch
函数
对我有用的解决方案:
md-autocomplete 上的 md-no-cache="true" 仍然是强制自动完成重新初始化 md-items 的必要条件;
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只是returns筹码在筹码列表中的位置;
我正在尝试此处的 <md-autocomplete>
示例 md-chips
为了防止 selected 项进入 <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;
}
但我的问题是,一旦我们 select 一个项目,控件就不会进入这个函数。有人可以解释一下如何解决这个问题吗?
我从这个文档中找到了解决方案:md-autocomplete
我们只需添加md-no-cache="true"
,用于每次搜索查询项时调用querySearch
函数
对我有用的解决方案: md-autocomplete 上的 md-no-cache="true" 仍然是强制自动完成重新初始化 md-items 的必要条件; 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只是returns筹码在筹码列表中的位置;