Angular2 多維數組 ng-for 不起作用

Question

我正在使用 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>

這是管道：

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;
  }
}

Answer 1

根據相關更新，您需要在循環之前將對象轉換為數組：

<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;
  }
}