Angularjs和UI-Select：如何从代码中选择一个选项

发布时间：2020-12-17 17:38:46 所属栏目：安全来源：网络整理

导读：在 angularjs我有一个ui选择： ui-select ng-model="itemSelected.selected" theme="selectize" ng-disabled="disabled" ui-select-match placeholder="Select an item..."{{$select.selected.Name}}/ui-select-match ui-select-choices repeat="item in ite

在 angularjs我有一个ui选择：

<ui-select ng-model="itemSelected.selected" theme="selectize" ng-disabled="disabled">
   <ui-select-match placeholder="Select an item...">{{$select.selected.Name}}</ui-select-match>
   <ui-select-choices repeat="item in itemsList">
      <span ng-bind-html="item.Name"></span>
   </ui-select-choices>
</ui-select>

如何在加载页面时从代码中选择项目？
当我在控制器中加载页面时,我得到$scope.itemsList：如何从控制器中选择特定项？

谢谢

解决方法

您可以在控制器负载本身上设置它

标记

<body ng-controller="DemoCtrl">
  <p>Selected: {{item.selected}}</p>
  <ui-select ng-model="item.selected" theme="select2" ng-disabled="disabled" style="min-width: 300px;">
    <ui-select-match placeholder="Select a item in the list">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat="item in items | propsFilter: {name: $select.search,age: $select.search}">
      <div ng-bind-html="item.Code | highlight: $select.search"></div>
    </ui-select-choices>
  </ui-select>
</body>

码

app.controller('DemoCtrl',function($scope,$http) {
  $scope.disabled = undefined;

  $scope.clear = function() {
    $scope.item.selected = undefined;
  };

  $scope.item = {};
  $scope.items = [
    { name: 'Item1',Code: 'Code1',},{ name: 'Item2',Code: 'Code3'},{ name: 'Item3',Code: 'Code4'},{ name: 'Item4',Code: 'Code4' },{ name: 'Item5',Code: 'Code5' },];

  $scope.item.selected = $scope.items[0] //here you can set the item selected
});

Working Plunkr

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!