Question

以下是从服务器返回的Json数据：

 $scope.cities = response.data;

是：

0: {id: 1, name: "Malaysia",…}
    city: [{id: 1, country_id: 1, city: "Kuala Lumpur"}, {id: 2, country_id: 1, city: "Selangor"},…]
        0: {id: 1, country_id: 1, city: "Kuala Lumpur"}
          city: "Kuala Lumpur"
          country_id: 1
          id: 1
        1: {id: 2, country_id: 1, city: "Selangor"}
          city: "Selangor"
          country_id: 1
          id: 2
   id: 1
   name: "Malaysia"
1: {id: 2, name: "Singapore", city: [{id: 11, country_id: 2, city: "Singapore"}]}
   city: [{id: 11, country_id: 2, city: "Singapore"}]
   id: 2
   name: "Singapore"

在我的观点中

<ui-select ng-model="cities.selected" theme="bootstrap">
    <ui-select-match placeholder="Select City">
            {{$select.selected.name}}
    </ui-select-match>
    <ui-select-choices repeat="item in cities | filter: $select.search">
        <div ng-bind-html="item.city.city | highlight: $select.search"</div>
    </ui-select-choices>
</ui-select>

但是我无法呈现以下下拉方式：

-Malaysia
  - Kuala Lumpur
  - Selangor
-Singapore
  -Singapore

谢谢！

Answer 1

试试这个。使用嵌套的ng-repeat并将其绑定在li标签中。

<ui-select-choices repeat="item in cities | filter: $select.search">
        <div ng-bind-html="item.city.city | highlight: $select.search"</div>
<li ng-repeat="data in item.city">
{{data.city}}
</li>
    </ui-select-choices>

Answer 2

试试这个

 <ui-select ng-model="cities.selected" theme="bootstrap">
        <ui-select-match placeholder="Select City">
                {{$select.selected.name}}
        </ui-select-match>
        <ui-select-choices ng-repeat="item in cities | filter: $select.search">
      <div ng-bind-html="item.name| highlight: $select.search"</div>
            <li ng-repeat="data in item.city">
           {{data.city}}
         </li>
        </ui-select-choices>
    </ui-select>

AngularJS下降2级深度

2 个答案: