angular ui-select(group by)初始值始终选择重复的最后一个

时间:2016-07-06 18:59:55

标签: angularjs ui-select

如果存在对象属性id的重复,我在选择初始值时遇到问题。

foo bar示例是: 小组最喜欢的动物:

    {id:'1',text:'dog', group:'Favourite animals'},
    {id:'2',text:'parrot', group:'Favourite animals'},
    {id:'3',text:'cat', group:'Favourite animals'}

将所有动物分组:

    {id:'1',text:'dog', group:'All animals'},
    {id:'2',text:'parrot', group:'All animals'},
    {id:'3',text:'cat', group:'All animals'},
    {id:'4',text:'fish', group:'All animals'},
    {id:'5',text:'turtle', group:'All animals'},
    {id:'6',text:'hamster', group:'All animals'}

狗,鹦鹉和猫事实上是重复的,只有id(绑定模型)

问题是,ui-select选择最后一个,如果我设置为这样的初始值:

$scope.model = ['1'];

如果我从下拉列表中选择,那么一切都还可以。

有没有办法“告诉”ui-select选择第一个?

下面是整个代码(HTML,js)或示例代码集http://codepen.io/martin80cz/pen/qdwJMm

HTML:

   <div ng-app="app" class="container">
      <div ng-controller="select" class="row">
        <div class="col-md-12">
          <h1>ui-select (group by) initial value always last problem</h1>
          <ui-select theme="bootstrap" ng-model="model[0]">
            <ui-select-match>{{$select.selected.text}}</ui-select-match>
            <ui-select-choices repeat="value.id as value in options | filter: {text:$select.search}"
                               group-by="'group'">
                <div ng-bind-html="value.text | highlight: $select.search"></div>
            </ui-select-choices>
          </ui-select>
        </div>
      </div>
    </div>

JS:

angular.module('app',['ui.select','ngSanitize'])
.controller('select',['$scope',function($scope){
    //initial value
  $scope.model = ['1'];
  //all options
  $scope.options = [
    //without group
    {id:'0', text:'Not chosen',group: undefined},
    //favourite animals
    {id:'1',text:'dog', group:'Favourite animals'},
    {id:'2',text:'parrot', group:'Favourite animals'},
    {id:'3',text:'cat', group:'Favourite animals'},
    //all animals
    {id:'1',text:'dog', group:'All animals'},
    {id:'2',text:'parrot', group:'All animals'},
    {id:'3',text:'cat', group:'All animals'},
    {id:'4',text:'fish', group:'All animals'},
    {id:'5',text:'turtle', group:'All animals'},
    {id:'6',text:'hamster', group:'All animals'},
    ]
}]);

0 个答案:

没有答案