在多个选择框中选择默认值

时间:2018-04-25 14:53:09

标签: angularjs

  

这是我的HTML部分

 <select size="3"  name="selectedSaleStatus[]" multiple ng-model="selectedSaleStatus" ng-options="type.name for type in config.saleStatus" >

</select>
  

我的控制器

 $scope.saleStatus = [
            {'id': 18, 'name': 'ABC'},
            {'id': 19, 'name': 'DEF'},
            {'id': 20, 'name': 'GHI'}
        ];
  

我希望我的默认选定项目为ABC

2 个答案:

答案 0 :(得分:1)

function testcontroller($scope, $filter) {
    $scope.saleStatus = [{
            'id': 18,
            'name': 'ABC',
            'val': true
        },
        {
            'id': 19,
            'name': 'DEF',
            'val': false
        },
        {
            'id': 20,
            'name': 'GHI',
            'val': false
        }
    ];

    $scope.selected = [{
        id: 18,
        name: "ABC"
    }];

    $scope.selectedValues = [];

    $scope.$watch('selected', function(nowSelected) {
        $scope.selectedValues = [];

        if (!nowSelected) {
            return;
        }
        angular.forEach(nowSelected, function(val) {
            $scope.selectedValues.push(val.id.toString());
        });
    });


}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body ng-app ng-controller="testcontroller">
   <select multiple ng-model="sales">
      <option ng-selected="{{sale.id == selectedValues}}" ng-repeat="sale in saleStatus" value="{{sale.id}}">{{sale.name}}</option>
   </select>
   </div>
</body>

答案 1 :(得分:1)

使用http://mgcrea.github.io/angular-strap/#/selects

<button id="saleItems" type="button" placeholder="choose" ng-model="selectedSaleStatus"
                                        bs-select data-multiple="1" max-length-html="choosed" bs-options="x.id as x.name for x in saleStatus">
                                    </button>

在控制器中

$scope.selectedSaleStatus = [18];