动态嵌套对象的Angular 7搜索过滤器

Question

在我的 Angular 7 项目中，我得到了使用 *ngFor 显示的以下 JSON 数据（嵌套结构）。

JSON

[
 {
     1: [
        { 
            "name" : "A"
        },
        { 
            "name" : "B"
        },
        { 
            "name" : "C"
        }
     ],

     2: [
        { 
            "name" : "D"
        },
        { 
            "name" : "E"
        },
        { 
            "name" : "A"
        }
     ]
 }
]

显示代码

<div *ngFor="let data of result | keyvalue">
        <div> 
                {{data.key}}
        </div>
        <div *ngFor="let innerData of data.value;">
           {{innerData.name}}
        </div>
</div>

我想使用角管对嵌套数据结构进行过滤。例如：如果我给出名称“A”的值。结果应该如下。

预期的过滤结果

[
 {
     1: [
        { 
            "name" : "A"
        }
     ],

     2: [
        { 
            "name" : "A"
        }
     ]
 }
]

有人帮助我吗？

Answer 1

有什么理由过滤它吗？如果您只是不想在某些条件下显示元素，我认为*ngIf 是一个不错的选择。

ts：

searchOption = ''

html:

    <div *ngFor="let innerData of data.value;">
      <ng-container *ngIf="innerData.name === searchOption">
        {{innerData.name}}
      </ng-container>
    </div>