首先，我想为这个问题添加更多的上下文。
现在我有以下内容：
- 一个列表项，其中包含另一个浮动在其旁边的列表
- 目前，我正在使用mouseover/out事件向类显示和隐藏基于属性的元素
我想通过消除在类中有一个属性的需要，只需在html元素中添加一个数据属性，使它更具动态性，希望我可以使用所述属性管理它的状态。
整个想法可能是错误的，所以如果有其他方法可以实现这一点，请引导我朝着正确的方向前进。
谢谢！
更新
经过一些思考，我稍微改变了我的方法，不再依赖组件属性，而是为每个元素添加了一个新的[attr.data-visible]属性，该属性带有默认的"；false"；价值然后，在mouseover事件中，我添加了一个方法，该方法获取html元素作为参数，然后在mouseout事件中将数据可见值从false更改为true，反之亦然。
这是一个正在工作的StackBlitz
演示您可以使用ngClass和事件来完成它。
[ngClass]="{'your_class': isHovered}"
(mouseover)="isHovered=true"
(mouseout)="isHovered=false"
如果您有一个数组对象并在其中执行，则为数组中的每个对象指定属性
[ngClass]="{'your_class': data.isHovered}"
(mouseover)="data.isHovered=true"
(mouseout)="data.isHovered=false"
您可以使用以下语法添加/删除类：
<div [class.your-class-name]="condition"></div>
为了在不需要组件的情况下引用元素，您可以使用以下模板引用变量：
<div #abc></div>
现在abc可以在模板中使用，以引用它的div元素