ui-select配列要素をドロップダウンの選択肢として表示

Question

私は以下のようにui-selectを使用しています。

<ui-select id="ItemId" ng-model="ctrl.ItemId" theme="bootstrap" 
         ng-disabled="ctrl.DownDisabled" required> 
       <ui-select-match placeholder={{ctrl.Placeholder}}>{{$select.selected.item}} 
       </ui-select-match> 
       <ui-select-choices 
         repeat="item in ctrl.owners.components"> 
        <div ng-bind-html="item | highlight: $select.search"></div> 
       </ui-select-choices> 
       <ui-select-no-choice> 
        No features were found 
       </ui-select-no-choice> 
      </ui-select> 

それがオーバーitearingれるJSONは

ctrl.owners = { 
      value : 123, 
      teamName : ABC, 
      components : [a,b,c] 
      }; 

である。しかしUIのドロップダウンメニューには、 "いいえ機能が見つかりませんでした" と表示されます。どうした。私の目的は、componentsを個々の選択肢としてドロップダウンに表示することです。 AFAIKこれは何らかの形で、ui-select-choicesのネストされたリピートを使用して行う必要があります。どうやってやるの？

Answer 1

<div class="form-group "> 
    <ui-select ng-model="person.selected" theme="bootstrap"> 
    <ui-select-match placeholder="Select or search a person in the list...">{{$select.selected.name}}</ui-select-match> 
    <ui-select-choices repeat="item in people | filter: $select.search"> 
     <div ng-bind-html="trustAsHtml((item.name | highlight: $select.search))"></div> 
     <small ng-bind-html="trustAsHtml((item.email | highlight: $select.search))"></small> 
    </ui-select-choices> 
    </ui-select> 
</div> 

$scope.people = [ 
{ name: 'Adam',  email: 'adam@email.com',  age: 12, country: 'United States' }, 
{ name: 'Amalie', email: 'amalie@email.com', age: 12, country: 'Argentina' }]; 

このように使用すると効果があります。 ここでは、trustAsHtmlがメソッドです。

$scope.trustAsHtml = function(value) { 
    return $sce.trustAsHtml(value); 
    };