vno*_*oec 9 angularjs angular-ui
我想使用angular-ui ui.select来填充a multiple dropdown field.我想将选定的对象传递给ng-model并将其映射到我的选项,包含相同结构的对象,但不是来自同一个源:
<div ng-repeat="training in trainings">
<form class="form-horizontal" role="form">
<ui-select multiple ng-model="training.skills" theme="select2" ng-disabled="disabled">
<ui-select-match placeholder="Wähle Skills...">{{$item.name}}</ui-select-match>
<ui-select-choices group-by="skillTypeGrp" repeat="skill.id as skill in skills | filter: $select.search">
<span>{{skill.name}}</span>
</ui-select-choices>
</ui-select>
</form>
</div>
Run Code Online (Sandbox Code Playgroud)
带有示例培训的trainings列表ng-repeat如下所示:
[{"description": "",
"skills": [{"type": "tech",
"name": "C",
"id": 194}],
"id": 1,
"name": "Test"}]
Run Code Online (Sandbox Code Playgroud)
我的skills列表ui-select-choices包含与以下相同的数据结构training.skills:
[{"type": "tech",
"name": "C#",
"id": 194},
{"type": "tech",
"name": "Java",
"id": 197},
...]
Run Code Online (Sandbox Code Playgroud)
不幸的是,这不起作用.ui-select清空我training.skills,给我一个空白的选择字段.我知道angularjs无法映射这些对象,如果它们不是来自同一个数组,就像这篇博文中所述.它建议使用track by告诉ui.select哪个属性用于映射两个对象列表,但是如果我将该ui-select-choices行更改为:
<ui-select-choices group-by="skillTypeGrp" repeat="skill.id as skill in skills track by skill.id | filter: $select.search">
Run Code Online (Sandbox Code Playgroud)
没有什么变化.有没有可能让它运行而不用像他们的id那样替换我的对象,就像单个属性绑定示例所暗示的那样?
小智 0
如果我没记错的话,你正在尝试将整个对象与其 id 进行比较。
您是否尝试过使用:
<ui-select-choices group-by="skillTypeGrp" repeat="skill in skills | filter: $select.search">
<span>{{skill.name}}</span>
</ui-select-choices>
Run Code Online (Sandbox Code Playgroud)
请注意,我从重复中删除了“skill.id”。我认为通过这种方式你应该比较对象并希望它会起作用。
否则,我将保留 ui-select-choices,因为您拥有它,并在 ui-select 中传递一组 ID(选定的训练)以匹配列表。当然,这意味着每次发生变化时,您都需要进行更多编码来更新技能数组。
希望能帮助到你。
| 归档时间: |
|
| 查看次数: |
4250 次 |
| 最近记录: |