1

다음과 같이 ui-select를 사용하고 있습니다.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에서 중첩 반복을 사용하여 어떤 방식 으로든 수행되어야합니다. 어떻게 할 수 있니?

+0

당신은 플 런커를 올릴 수 있습니까? –

답변

2
<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: '[email protected]',  age: 12, country: 'United States' }, 
{ name: 'Amalie', email: '[email protected]', age: 12, country: 'Argentina' }]; 

이렇게하면 사용할 수 있습니다. 여기에서 trustAsHtml이 메서드입니다.

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

$ scope.people에 선택 항목으로 표시해야하는 값 배열이 포함 된 키를 포함하는 경우 반복 처리하는 방법. – station