css - 是否可以在 ngClass 中传递 html 属性？

Question

我正在使用 Ionic，并且在 myComponent.html 文件中有一个如下所示的 svg 路径：

 <path id="US" (click)="countryNameDetails($event)" title="United States" [ngClass]="{'BEEN' : array.indexOf('United States') !== -1, 'NOTBEEN' : array.indexOf('United States) === -1 }".../>

路径根据单词是否在我的数组中更改 CSS 类。这个词与每个路径的标题基本相同，我不想继续写出标题名称。无论如何我可以在我的ngClass的路径中传递title属性...我已经尝试了我能想到的一切！

谢谢！

Answer 1

您可以将模板引用变量添加到 svg 路径并访问 title 属性。

<path
  title="United States"
  [ngClass]="{'BEEN': array.indexOf(path.title) !== -1, 'NOTBEEN': array.indexOf(path.title) === -1 }"
  #path
/>

我更喜欢这种语法：

<path
  title="United States"
  [ngClass]="array.includes(path.title) ? 'been' : 'not-been'"
  #path
/>