将数据绑定到 Angular 中的非本地 html 属性

Question

我喜欢将数据库中的一些数据绑定到 Angular 应用程序中的非自然标签元素，这与“同位素过滤器”有关： 我想改变这个

<li><a href="#" data-filter=".joomla"></li>

到

<li *ngFor="let cat of categories;index as i">
<a href="#" class="active" [data-filter]=categoriesId[i]>{{cat.Title}}</a>

其中 categoriesId 是我的 ts 文件中的字符串数组，但我遇到了这个错误：

无法绑定到“数据过滤器”，因为它不是“a”的已知属性。

我在做一个不可能的动作吗？如果是的话，有什么解决方案可以做这样的事情吗？

Answer 1

您可以使用 here: 中记录的属性绑定语法：

<li *ngFor="let cat of categories;index as i">
    <a href="#" class="active" [attr.data-filter]=categoriesId[i]>{{cat.Title}}</a>
</li>