angularjs - angularjs:加载时无法在 md-select 中显示多个选定项目
问题描述
我正在学习使用“Angularjs”开发 Web 应用程序。
应用程序的网页是用户编辑其个人资料的输入表单。输入表单在角度材料显示控件中显示用户的现有详细信息。我正在使用“md-select”下拉菜单来显示用户的爱好。但是我无法在“md-select”下拉列表中显示现有的爱好。
以下是非工作代码:
HTML:
<md-select ng-model="ctrl.exthobbies" ng-model-options="{trackBy: '$value.id'}">
<md-option ng-repeat="n in ctrl.hobbies" ng-value="n">
{{ n.value }}
</md-option>
</md-select>
<p>number: {{ ctrl.exthobbies}}</p>
JS:
_this.exthobbies= [{id: 1, value: "Reading"},{id: 6, value: "Paragliding"}];
_this.hobbies= [
{id: 0, value: "None"},
{id: 1, value: "Reading"},
{id: 2, value: "Writing"},
{id: 3, value: "Driving"},
{id: 4, value: "Swimming"},
{id: 5, value: "Skating"},
{id: 6, value: "Paragliding"},
{id: 7, value: "Hiking"}
];
请在“Codepen”中找到完整代码: https ://codepen.io/oiproj/pen/KKwBxoM
问题:可以解决这个问题吗?
解决方案
您应该将multiple="true"添加到md-select以支持多个项目:
<md-select multiple="true" ng-model="ctrl.exthobbies" ng-model-options="{trackBy: '$value.value'}">
<md-option ng-repeat="n in ctrl.hobbies track by n.value" ng-value="n">
{{ n.value }}
</md-option>
</md-select>
推荐阅读
- php - WP 自定义帖子类型查询不返回自定义分类
- php - 在 foreach 循环中将键从数组添加到现有数组值
- typescript - 推送屏幕上未定义的 React Native Navigation 道具
- algorithm - 从函数自动构建决策树
- c# - 如何在 .Net Core 2.2 中解决 Microsoft.AspNetCore.Mvc.Internal.ActionContext.GetNormalizedRouteValue
- react-native - 如何根据显示尺寸对 ImageBackground 进行平方?
- vue.js - store getter 返回观察者对象而不是 null
- java - 如何在以特定数字开头的地图中查找值
- javascript - Angular2-mentions - 如何从 Angular 4 中的 angular2-mentions 添加 URL 链接到提到的用户
- linux - 为 linux 构建没有 PNG_READ_eXIf_SUPPORTED 的 libpng