【问题标题】:How to get the selected option from ui-select multiple如何从 ui-select multiple 中获取选定的选项
【发布时间】:2016-12-22 17:43:07
【问题描述】:

我在弄清楚如何从ui-select 获取多选表单中的选定值时遇到了一些问题。 我做了一个 sn-p 来告诉你我想做什么。在我的 html 中,我做了一个带有 ng-change-event 回调的 ui-select:ng-change="onDatasetChanged(whatShouldBehere?)"。选择该选项后,我只想在控制器的 onDatasetChanged()-method 内打印所选模型。

angular.module('myApp',['ui.select']).controller('MyController', function ($scope) {
  
  $scope.myUiSelect={model:{}}; // encapsulate your model inside an object.
  $scope.availableData=["a","b","c"]; //some random options
  
  $scope.onDatasetChanged = function(selectedValue){
    console.log("selectedValue",selectedValue);
  }
  
});
<link href="https://rawgit.com/angular-ui/ui-select/master/dist/select.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://rawgit.com/angular-ui/ui-select/master/dist/select.js"></script>
<body ng-app="myApp" ng-controller="MyController">
  
  
  
  <ui-select multiple ng-model="myUiSelect.model" close-on-select="false" title="Choose a dataset" ng-change="onDatasetChanged(whatShouldBehere?)">
    <ui-select-match placeholder="Select something">{{$item.label}}</ui-select-match>
      <ui-select-choices repeat="data in availableData | filter:$select.search">
                        {{data}}
      </ui-select-choices>
  </ui-select>
  
  
  
</body>

【问题讨论】:

    标签: ui-select


    【解决方案1】:

    在对ui-select-directive 的存储库页面进行一些研究之后 我想你可以像这样使用on-select 事件绑定: on-select="onSelect($item, $model)"。查看更新的 sn-p:

    angular.module('myApp',['ui.select']).controller('MyController', function ($scope) {
      
      $scope.myUiSelect={model:{}}; // encapsulate your model inside an object.
      $scope.availableData=["a","b","c"]; //some random options
      
      $scope.onSelect = function(item,model){
        console.log("selectedItem",item);
      }
      
    });
    <link href="https://rawgit.com/angular-ui/ui-select/master/dist/select.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <script src="https://rawgit.com/angular-ui/ui-select/master/dist/select.js"></script>
    <body ng-app="myApp" ng-controller="MyController">
      
      
      
      <ui-select multiple ng-model="myUiSelect.model" close-on-select="false" title="Choose a dataset" on-select="onSelect($item, $model)">
        <ui-select-match placeholder="Select something">{{$item.label}}</ui-select-match>
          <ui-select-choices repeat="data in availableData | filter:$select.search">
                            {{data}}
          </ui-select-choices>
      </ui-select>
      
      
      
    </body>

    【讨论】:

      猜你喜欢
      • 2012-08-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多