Question

Angular不会识别数据悬停。

无法绑定到＆＃39;数据悬停＆＃39;因为它不是'span＆＃39; span'的已知属性。

我试过跨度，没有运气。现有页面在很大程度上依赖于数据悬停，因此重写不是一种选择。

<a class="main-item" routerLink='{{ item?.url}}'>
    <span class="main-item-hover" data-hover="{{item?.label}}">{{item?.label}}</span>
</a>

这段代码在没有角度的情况下完美运行

编辑：

.main-item-hover:before {
  content: attr(data-hover);
  font-weight: 600;
  position: absolute;
  top: 100%;
}

这是在css中使用数据悬停的方式。

想法？

Answer 1

尝试使用方括号和属性绑定重写代码

<a class="main-item" [routerLink]="item?.url">
  <span class="main-item-hover" [attr.data-hover]="item?.label">
    {{ item?.label }}
  </span>
</a>