md-select multiple中的角度材质设置默认选项

Question

我试图关注此tutorial，但我无法使其适用于multiple md-select。事实上，我有多个用户选择列表，我希望有2个用户默认选择。

是否有解决方案来实现这一目标？

Answer 1

你需要跟踪所有选定的用户，而不是只有一个。并根据需要在阵列上删除/添加它们。

.controller('MyCtrl', function($scope) { 
    $scope.users = [ 
    { id: 1, name: 'Bob' }, 
    { id: 2, name: 'Alice' }, 
    { id: 3, name: 'Steve' } 
    ]; 

    $scope.selectedUsers = []; 

    $scope.selectUser = function (id) { 
    var user = $scope.users.filter(function(user) { 
      return user.id == id; 
     })[0]; 
    var idx = $scope.selectedUsers.indexOf(user); 
    if (idx < 0) { 
     $scope.selectedUsers.push(user); 
    } else { 
     $scope.selectedUsers.splice(idx, 1); 
    } 
    } 
} 

并在视图中添加multiple并切换到selectedUsers。

<md-select ng-model="selectedUsers" multiple ng-model-options="{trackBy: '$value.id'}"> 
    <md-option ng-value="user" ng-repeat="user in users">{{ user.name }}</md-option> 
</md-select> 

Codepen：https://codepen.io/kuhnroyal/pen/VWeWaw

Answer 2

控制器：

$scope.users = [ 
    { id: 1, name: 'Bob' }, 
    { id: 2, name: 'Alice' }, 
    { id: 3, name: 'Steve' } 
]; 

$scope.selectedUser =[ 
    { id: 1, name: 'Bob' }, 
    { id: 2, name: 'Alice' } 
]; 

查看：

<md-select ng-model="selectedUser" ng-model-options="{trackBy: '$value.id'}" multiple> 
    <md-option ng-value="user" ng-repeat="user in users">{{ user.name }} 
    </md-option> 
</md-select> 

Answer 3

该代码定义选定对象

$scope.selectedUsers = []; 

可以通过默认与一些用户

$scope.selectedUsers =[ 
    { id: 1, name: 'Bob' }, 
    { id: 2, name: 'Alice' } 
]; 

这是因为它设置的阵列ng-model设置为selectedUsers。 如果您需要更多关于NG-MODEL的信息，请点击此处：https://docs.angularjs.org/api/ng/directive/ngModel

您还将了解更多关于AngularJS中数据绑定的信息。

此外，您将不得不更新您的HTML以允许md-select具有多个选定的值。

<md-select ng-model="selectedUsers" multiple></md-select>

你会了解更多关于在这里https://material.angularjs.org/latest/api/directive/mdSelect