web-dev-qa-db-ja.com

Typescript Convert Object to Array-* ngForはオブジェクトの反復をサポートしないため

  • このようにオブジェクトを配列に変換するためにforループを使用したくありません!プロセスが2倍になり、アプリのパフォーマンスが低下する場合(FirebaseでIonic2とTypeScriptを使用しています)

    for(let key in data){array.Push(value); }

* ngForを使用してオブジェクト自体を反復する解決策はありますか(添付図を参照)。

または、このオブジェクト(添付の図を参照)を配列に変換して、* ngForで反復可能にすることができます。

enter image description here

6

Object.keys(obj)を使用して、名前付きインデックスを取得できます。これにより、さらに使用/カスタマイズできる配列構造が返されます。オブジェクト値を反復処理するためのサンプルの使用法は次のようになります

var persons = { 
    john: { age: 23, year:2010},
    jack: { age: 22, year:2011},
    jenny: { age: 21, year:2012}
}

イテレーターを取得する

var resultArray = Object.keys(persons).map(function(personNamedIndex){
    let person = persons[personNamedIndex];
    // do something with person
    return person;
});

// you have resultArray having iterated objects 
28

Angular 6であるため、キーバリューパイプ演算子があります。以下を実行します。

*ngFor="for item in objectList | keyvalue"

item.key # refers to the keys (134, 135...) in your example
item.value # refers to the object for each key
6
henry74