Angular：打印存储在数组中的键值对

Question

在我的Angular项目中，我从未排序的后端获取数据。数据采用JSON格式的键值对。今天，我只使用keyvalue管道将键和值拆分为2列。我仍然想这样做，但是我希望数据按特定顺序排序。我选择使用数组以正确的顺序放置数据。 （自定义管道）问题是我不知道如何获取存储在此数组中的键值对的元素。现在，它只是打印出[Object object]。是否还有另一个管道或可以用来获取数据的东西？

现在我的代码看起来像这样：

    <tr *ngFor="let f of mydata$ | async | custompipe | keyvalue">
            <td class="key">{{ f.key | titlecase }}:</td>
            <td class="value">{{ f.value }}</td>
          </tr>

编辑：myData $是一个Observable，正在从redux存储获取其数据。

我的管道有一个转换，该转换返回具有键值的数组，或更具体地说，返回具有键和值的接口。

transform(input: any): myKeyValueInterface[] {
    let output: myKeyValueInterface[] = [];
    for (const key in kundinfo) {
      if (kundinfo.hasOwnProperty(key)) {
        console.log(key + ': ' + kundinfo[key]);
        const newElement: myKeyValueInterface= {key, value: input[key]};
        output.push(newElement);
      }
    }
    return output;
  }

Answer 1

keyvalue管道将Object或Map转换为键值对数组。

您已经使用自定义管道将输入转换为数组，因此您只需删除keyvalue管道即可使用。

<tr *ngFor="let f of mydata$ | async | custompipe">
    <td class="key">{{ f.key | titlecase }}:</td>
    <td class="value">{{ f.value }}</td>
</tr>