如何从选择选项中选择多个选定值

Question

我的控制器代码看起来像

$scope.items = [{
    heading: 'Sports',
    types: [{
        name: 'Football',
    }, {
        name: 'Persie',
    }, {
        name: 'Ronaldo',
    }, {
        name: 'Messy',
    }],
    id: '1'
}, {
    heading: 'Cricket',
    types: [{
        name: 'Tendulkar',
    }, {
        name: 'Lara',
    }, {
        name: 'Ponting',
    }],
    id: '2'
}];

我的视图包含这样的内容： 用户单击提交按钮时如何获取选项的选定值

Answer 1

这里是jsfiddle 我使用 ng-repeat 构建选择和 ng-options 来填充它们，然后您必须使用相对 ng-model 来获取选择。

HTML：

<div ng-app ng-controller="MyCtrl">
  <select class="select fancy" ng-repeat="(i, item) in items" ng-model="searchOption[i]" ng-options="type.name for type in item.types"></select>
  <button ng-click="submitIt()">Submit</button>
</div>

Javascript：

function MyCtrl($scope) {
    $scope.submitIt = function () {
        console.log($scope.searchOption);
    };

    $scope.searchOption = [];

    $scope.items = [{
            heading: 'Sports',
            types: [{
                name: 'Football',
    }, {
                name: 'Persie',
    }, {
                name: 'Ronaldo',
    }, {
                name: 'Messy',
    }],
            id: '1'
  }, {
            heading: 'Cricket',
            types: [{
                name: 'Tendulkar',
    }, {
                name: 'Lara',
    }, {
                name: 'Ponting',
    }],
            id: '2'
  }];
}