一个接一个地过滤一个表 - Angular 2++

Question

我正在学习 Angular 2++，我想创建 2 个动态表，当单击另一个表的行时可以对其进行过滤。例如。假设我们有下一张桌子：

---

表 1

ID1     Box Name   Size

1       BOX1       17sqm
2       BOX2       18sqm
3       BOX3       19sqm

---

表 2

ID1     ID2     Box assets    Pieces

1       a       Chair         3pcs
1       b       Table         2pcs
2       c       TVs           4pcs
2       d       Lawnmower     2pcs
3       e       Vehicle       1pcs

---

因此，当我单击第一个表的第一行时，它只会显示第二个表的 2 行。如果我单击第二个表的最后一行，它只会显示第一个表的最后一行。

这可能吗？

Answer 1

您需要维护 2 个对象数组才能显示 2 个表格。我们需要在表 1 中有一个唯一的 id，这将是表 2 中的外键（关联键）

从上表中，'ID1' 是表 1 中的唯一 id，'ID1' 是表 2 中的关联键。当我们点击表 1 中的项目时，使用 ID1 值，对表 2 应用过滤器，并在 DOM 中显示结果。