角度アプリケーションで複数のカテゴリでUi-selectを使用する

Question

ui-selectで複数のカテゴリタイプを持つ検索ドロップダウンを作成しようとしています。私はこの作業をするために自分のデータをどのように平らにするかを考え出すのに苦労しています。私は1つのカテゴリの仕事をすることができますが、倍数ではありません。

このような何か：

今の私のコードは、名前だけのカテゴリを示し、このようなもの、になります。

<ui-select ng-model="data.selected"> 
     <ui-select-match placeholder=" ">{{$select.selected.name}}</ui-select-match> 
     <ui-select-choices repeat="item in flatData | propsFilter: {name: $select.search}"> 
      <div ng-bind-html="item.name | highlight: $select.search"></div> 
     </ui-select-choices> 
</ui-select> 

は、誰もが今までこのような何かを持っていました、誰かが私に助言を与えることができますか？

Answer 1

このようにすることにより、UI選択グループを使用するためには、あなたがこのような何かを見て、あなたのデータを再構築する必要があると思いますが：

[{ 
    category: 'Locations', 
    name: 'Sydney' 
}, 
{ 
    category: 'Locations', 
    name: 'Hong Kong' 
}, 
{ 
    category: 'Locations', 
    name: 'New York' 
}, 
{ 
    category: 'Names', 
    name: 'Bob A.' 
}, 
{ 
    category: 'Names', 
    name: 'Andrew S.' 
}, 
{ 
    category: 'Names', 
    name: 'George M.' 
}] 

今あなたができるパラメータ「カテゴリ」でグループにこのデータをこのように：

<ui-select ng-model="data.selected"> 
    <ui-select-match placeholder=" ">{{$select.selected.name}}</ui-select-match> 
    <ui-select-choices group-by="flatData.category" repeat="item in flatData | propsFilter: {name: $select.search}"> 
     <div ng-bind-html="item.name | highlight: $select.search"></div> 
    </ui-select-choices> 
</ui-select>