Question

我正在使用Angular2，我已经以这种方式从Firebase检索了一些数据：

dataset: any;
onGetData() {
    this._dataService.getAllData()
        .subscribe(
        data => this.dataset = JSON.stringify(data),
        error => console.error(error)
    );

如果我打印dataset我得到这个JSON：

{"-KE8XuCI7Vsm1jKDJIGK":{"content":"aaa","title":"bbb"},"-KE8XvM268lWhXWKg6Rx":{"content":"cccc","title":"dddd"}}

如何打印出仅由此JSON数组中的title值组成的列表？

我想拥有：bbb - dddd

Answer 1

您只能使用ngFor迭代数组。在您的情况下，您需要实现自定义管道来迭代对象的键。

类似的东西：

@Pipe({name: 'keyValues'})
export class KeysPipe implements PipeTransform {
  transform(value, args:string[]) : any {
    let keys = [];
    for (let key in value) {
      keys.push({key: key, value: value[key]);
    }
    return keys;
  }
}

并使用它：

<span *ngFor="#entry of dataset | keyValues">           
  Title: {{entry.value.title}}
</span>

有关详细信息，请参阅此问题：

How to display json object using *ngFor

Answer 2

在您看来，您需要

<div *ngFor='#data of dataset'>
    {{ data.title }} -
</div>

从Angular2中的JSON数组中打印属性值

2 个答案: