在对象上使用ng重复时如何设置选中

时间:2014-08-28 10:08:10

标签: angularjs jquery-select2 ui-select2

我试图设置select2下拉列表的初始值。问题是该值是一个对象。 我试过用initSelection搞砸了,但我甚至无法称之为它。我把debugger放进去,没有任何反应。 ngSelected也不起作用:(

我做了plunker

标记

<select ui-select2="opt" 
      ng-change="save()"
      ng-model="chosen" 
      data-placeholder="Choose">
      <option value=""></option>
      <option ng-repeat="item in list" value="{{item}}">{{item.a + ' ' + item.b}}</option>
</select>

控制器

app.controller('MainCtrl', function($scope) {
  $scope.selected = {a: 2, b: 22};
  $scope.list = [{a: 1, b: 11}, {a: 2, b: 22}];

  $scope.opt = { 
    allowClear: true,
    initSelection: function (elem, callback) {
      debugger; // this never triggers... :(
    }
  };

  $scope.save = function() {
    $scope.pre = $scope.chosen;
  };
});

我希望在下拉列表中选择$scope.selected中的值。

2 个答案:

答案 0 :(得分:0)

这对你有用吗?

HTML:

<select ui-select2="opt" 
      ng-change="save()"
      ng-model="chosen" 
      data-placeholder="Choose">
      <option value=""></option>
      <option ng-repeat="item in list" value="{{item}}">{{item.a + ' ' + item.b}}</option>
</select>

JS:

app.controller('MainCtrl', function($scope) {
  $scope.selected = {a: 2, b: 22};
  $scope.list = [{a: 1, b: 11}, {a: 2, b: 22}];
  $scope.chosen = $scope.selected;

  $scope.opt = { 
    allowClear: true,
    initSelection: function (elem, callback) {
      debugger; // this never triggers... :(
    }
  };

  $scope.save = function() {
    $scope.pre = $scope.chosen;
  };
});

答案 1 :(得分:0)

我遇到了同样的问题,我没有找到任何 initSelection 的解决方案。

但我通过以下示例https://github.com/angular-ui/ui-select/blob/master/examples/demo.html

解决了它

在你的情况下,你需要这样做:

 <ui-select ng-model="Choose" theme="select2" ng-disabled="disabled">
                <ui-select-match>{{$select.selected.a}}</ui-select-match>
                <ui-select-choices repeat="item in list | filter: {a: $select.search}">
                    <div ng-bind-html="item.a| highlight: $select.search"></div>
                </ui-select-choices>
            </ui-select>