我正在使用Angular2,所有工作良好,但我无法打印出多维数组,以下是代码:
class AppComponent {
items:Array<Object>;
constructor(http: Http) {
http.get('data.json')
.map(res => res.json())
.subscribe(data => this.items = data);
}
}
第一个简单的非多维数组的例子与预期的一样
[{
"id": "1",
"v2": "L'Oréal Paris",
"v4": "Serum Absolute Advanced Age-Reversing Makeup"
}]
<div *ng-for="#item of items">
{{item.v2}} {{item.v4}}
</div>
发出错误且不工作的问题:
[{
"4940": {
"id": "4940",
"v2": "Pantene Pro-V",
"v4": "Cleansing Conditioner"
},
"4941": {
"id": "4941",
"v2": "Pantene Pro-V",
"v4": "Conditioner"
},
"4942": {
"id": "4942",
"v2": "Pantene Pro-V",
"v4": "2in1 Shampoo and Conditioner"
}]
<div *ng-for="#item of items">
<div *ng-for="#itemone of item">
{{itemone.v2}} {{itemone.v4}}
</div>
</div>
+++++++++++++++++++++++++++++++++++++++++++++++++
我找到了一个解决方案,你需要在循环之前将对象转换为数组:
<div *ng-for="#item of items">
<div *ng-for="#itemone of item | objToArr">
{{itemone.v2}} {{itemone.v4}}
</div>
</div>
这里是Pipe:
import { Pipe } from 'angular2/angular2';
@Pipe({
name: 'objToArr',
pure: false
})
export class ObjToArr {
transform(object:any) {
var newArray = []
for (var key in object) {
newArray.push(object[key]);
}
return newArray;
}
}
根据所讨论的更新,您需要在循环之前将对象转换为数组:
<div *ng-for="#item of items">
<div *ng-for="#itemone of item | objToArr">
{{itemone.v2}} {{itemone.v4}}
</div>
</div>
使用的管道如下:
import { Pipe } from 'angular2/angular2';
@Pipe({
name: 'objToArr',
pure: false
})
export class ObjToArr {
transform(object:any) {
var newArray = []
for (var key in object) {
newArray.push(object[key]);
}
return newArray;
}
}