短い答え:いいえ <md-chips>
成分は、そのトランスクルードコンテキストに<input>
又は<md-autocomplete>
をとるであろう。
ただし、md-autocompelet
でも同じことができます。 md-min-length
のキーは<md-autocomplete>
に設定されているので、メニューは<md-select>
のように自動的に表示されます。ここで は例です:
// controller.js
angular
.moduel('mdChipsDemo', [])
.controller('MdChipsDemoCtrl', function() {
var vm = this;
vm.selectedOption = '';
vm.searchText = '';
vm.launchAPIQueryParams = {
types: [],
};
vm.launchTypeOptions = [
{name: 'Op1', value: 1},
{name: 'Op2', value: 2},
{name: 'Op3', value: 3},
{name: 'Op4', value: 4},
];
});
// template.html
<div ng-app="mdChipsDemo" ng-controller="MdChipsDemoCtrl as vm">
<md-chips ng-model="vm.launchAPIQueryParams.types">
<md-autocomplete
md-selected-item="vm.selectedOption"
md-search-text="vm.searchText"
md-items="typeOption in vm.launchTypeOptions"
md-item-text="typeOption.name"
md-min-length="0"
placeholder="Search for a launchTypeOptions">
<span md-highlight-text="vm.searchText">{{typeOption.name}}</span>
</md-autocomplete>
<md-chip-template>
<span>{{$chip.name}}</span>
</md-chip-template>
</md-chips>
</div>
あなたの究極の目標は、複数の選択能力を持っているのであれば、<md-autocomplete>
もあなたがあなたの<md-select>
を置くことができる<md-item-template>
を公開doc for md-autocompleteをチェックして、あなたが表示されます。
<select>
を使用することを本当に主張している場合は、npmにサードパーティのコンポーネントがあり、あなたが望むことをするmd-chips-select
が呼び出されます。 https://www.npmjs.com/package/md-chips-select