我需要对<select>
从 http 服务接收的嵌套 JSON 数据进行分组和翻译以进行控制,最好不要触及客户端的数据格式,也不要创建辅助结构。因此控制器将为此包含接近零的逻辑,并且整个分组和翻译将在 HTML 标记方面。
我收到的数据是一个数组 multiple work groups
,其中每个都包含对其相关的 a以及该组service type
的所有内容的引用。work items
所以(简化的)结构是数组:
数据
[{
"id": 1,
"serviceTypeId": 1
"works": [{
"id": 101
},{
"id": 102
}]
}, ...
对于每种服务类型、工作组和工作,我只收到id
并且我需要根据当前语言环境翻译客户端上的值。翻译位于 JSON 文件中,其中所有键值对的结构为<KEY>.<id>:<translation>
. 例如:
翻译
"WORKGROUP.1" : "Some group",
"WORKGROUP.2" : "Other group",
...
"WORK.101" : "Work number 101
...
所以我需要结合id
已知key
的来获得正确的显示值。
我需要的是一个<select>
控件,所有可能work groups
的都按service type
. 选择一个组将显示所有相关works
的。这是我目前拥有的。
HTML
<select ng-model="selectedGroup"
ng-options="'WORKGROUP.' + g.id | translate group by 'SERVICETYPE.' + g.serviceTypeId | translate for g in groups"
ng-change="groupChanged()"></select>
...
<span ng-hide="!selectedGroup">
<label>
{{ 'WORKS' | translate }} -
{{ 'SERVICETYPE.' + selectedGroup.serviceTypeId | translate }} -
{{ 'WORKGROUP.' + selectedGroup.id | translate }}
</label>
<div ng-repeat="work in groupWorks">
{{ 'WORK.' + work.id | translate }} <br />
</div>
</span>
上面的工作很好,但它使用了我从原始数据创建的“组”变量(参见下面的 plunkr 链接)。有没有办法在控制器端没有添加逻辑的情况下对项目进行这种分组和翻译?
这是具有预期结果的相关 plunker:http: //plnkr.co/edit/99gVZe
编辑: 基于@plalx 的惊人见解,这里是我想要实现的链接http://plnkr.co/edit/3bMZZs