如何使用*ngFor过滤Angular中未知数量的元素？

Question

我需要创建一个搜索输入来过滤每个父帐户中的子帐户列表.目前,输入任一输入都会过滤所有帐户,而不是仅关联相关帐户.

实例(StackBlitz)
Basic(无FormArray)
使用FormArray

要求

1. 帐户和子帐户的数量未知(1 ...*)
2. 每个帐户都需要HTML中自己的搜索输入(FormControl)
3. 输入输入A应仅过滤帐户A的列表.
   输入输入B应仅过滤帐户B的列表.

问题

1. 如何确保每个FormControl仅过滤当前*ngFor上下文中的帐户？

2. 如何独立观看未知数量的FormControls以进行价值变化？我意识到我可以观看FormArray,但我希望有更好的方法.

理想情况下,解决方案应该:

1. 使用反应表单
2. 值改变时发出一个Observable
3. 允许动态地从表单添加/删除FormControls