在 angular md-select 中使用多个选项设置 selected 项
Setting selected item in angular md-select with multiple option
在 angular md-select 中设置 selected 项,有多个选项
<md-select multiple ng-model="Reg.roles" placeholder="Please select roles" required>
<md-option ng-repeat="role in roles" value="{{role.value}}" ng-selected="{{ role.value === '<%= data.roles %>' ? 'true' : 'false' }}">{{ role.name }}</md-option>
</md-select>
in my controller
$scope.roles = [{
"name": "Account Admin",
"value": "account_admin"
}, {
"name": "Developer",
"value": "developer"
},
{
"name": "Analyst",
"value": "analyst"
}
];
in view
data.roles 包含值:
['account_admin', 'developer']
我需要 role.value 对应的项目应该处于 selected 状态。
参考下图
最后我找到了解决方案,在我的控制器中我这样写:
var current_roles = '<%=data.roles%>'; // current value from db as array
$scope.Reg.roles = []; //initialize array
angular.forEach($scope.roles, function(val1, key1) {
if(current_roles.indexOf(val1['value']) !== -1) // check if item in current array
{
$scope.Reg.roles.push(val1['value']); //setting to select items
}
});
我不知道这有多有效,或者这是否解决了同样的问题,但您可以做的另一件事是在您的 HTML 中传递角色而不是 role.value。所以它看起来像这样:
<md-select multiple ng-model="Reg.roles" placeholder="Please select roles" required>
<md-option ng-repeat="role in roles" value="{{role}}" ng-selected="{{ role.value === '<%= data.roles %>' ? 'true' : 'false' }}">{{ role.name }}</md-option>
这使您可以在控制器中使用整个对象,并且可以随意操作它。
在 angular md-select 中设置 selected 项,有多个选项
<md-select multiple ng-model="Reg.roles" placeholder="Please select roles" required>
<md-option ng-repeat="role in roles" value="{{role.value}}" ng-selected="{{ role.value === '<%= data.roles %>' ? 'true' : 'false' }}">{{ role.name }}</md-option>
</md-select>
in my controller
$scope.roles = [{
"name": "Account Admin",
"value": "account_admin"
}, {
"name": "Developer",
"value": "developer"
},
{
"name": "Analyst",
"value": "analyst"
}
];
in view
data.roles 包含值:
['account_admin', 'developer']
我需要 role.value 对应的项目应该处于 selected 状态。
参考下图
最后我找到了解决方案,在我的控制器中我这样写:
var current_roles = '<%=data.roles%>'; // current value from db as array
$scope.Reg.roles = []; //initialize array
angular.forEach($scope.roles, function(val1, key1) {
if(current_roles.indexOf(val1['value']) !== -1) // check if item in current array
{
$scope.Reg.roles.push(val1['value']); //setting to select items
}
});
我不知道这有多有效,或者这是否解决了同样的问题,但您可以做的另一件事是在您的 HTML 中传递角色而不是 role.value。所以它看起来像这样:
<md-select multiple ng-model="Reg.roles" placeholder="Please select roles" required>
<md-option ng-repeat="role in roles" value="{{role}}" ng-selected="{{ role.value === '<%= data.roles %>' ? 'true' : 'false' }}">{{ role.name }}</md-option>
这使您可以在控制器中使用整个对象,并且可以随意操作它。