3

Angular2 を使用して JSON オブジェクトを HTML ページにブラウズする方法を探しています。各キーと各値を取得するため。

AngularJS では、次のディレクティブで可能ng-repeatです。

<div ng-repeat="(key, data) in dataSets">{{key}}</div>

しかし、Angular2 では、このようにする良い方法が見つかりません。

これは私のオブジェクトです:

Object {name: "Rue Saint-Nestor", oneway: "yes", highway: "residential",   maxspeed: "50", source:maxspeed: "FR:urban"}

キーと値を別々に取得したいだけです。実行できることはわかっていますがObject.keys()、可能であればディレクティブを使用したいと考えています。

ありがとう ！

4

1 に答える 1

4

それを行うカスタムパイプを作成できます

@Pipe({name: 'toKeyValueList'})
export class ToKeyValueListPipe implements PipeTransform {
  transform(value:number, args:string[]) : any {
    return // transform map to a list of keys and values
  }
}

<div *ngFor="let pair in dataSets | toKeyValueList">{{pair.key}} - {{pair.value}}</div>

結果をキャッシュする必要があります。入力が変更されていない場合、出力が変更されるべきではありません。それ以外の場合、Angular はデバッグ モードでエラー メッセージを生成します。

pipes: [ToKeyValueListPipe]使用する@Component()注釈の にパイプを追加することを忘れないでください。

于 2016-02-10T14:17:17.413 に答える