根据布尔变量值

Question

我有mat-card个组件的列表，这些组件在单击每个卡中的按钮时会分别展开。到目前为止，布尔值变量已经在HTML代码本身中定义，而不是在Angular .ts文件中定义，但是我想将其转换为在.ts文件中使用布尔值。

我尝试分配一个简单的布尔值，但是现在我发现所有卡都同时展开...

我知道出了什么问题，但是我无法考虑解决问题的方法：-/

这里是stackblitz

Answer 1

由于您的卡片是使用ngFor指令从数组中创建的，因此扩展后的数据也应存储在数组中！

.ts

thisExpands = [];

.html

[ngClass]="{expanded: thisExpands[x]}"

(click)="thisExpands[x] = !thisExpands[x]"

Demo