如何将动态数据绑定到ARIA-LABEL？

Question

我在html页面上有动态文本绑定到ARIA-LABEL。 这是一个有角度的2应用程序。我使用的是这样的东西： aria-label =＆＃34; {{productDetails？.ProductName}}的产品详情＆＃34;

但我收到错误 - 无法绑定到咏叹调标签＆＃39;因为它不是“div”的已知属性。

有没有解决方法呢？

Answer 1

在aria-label之前使用attr.：

attr.aria-label="Product details for {{productDetails?.ProductName}}"

Answer 2

您应该在目标属性周围使用方括号（[ ]）

[attr.aria-label]="'Product details for' + productDetails?.ProductName"

Answer 3

如果 productDetails 中的 ProductName 为空或未定义为，也可以进一步检查

[attr.aria-label]="(typeof productDetails.ProductName !== 'undefined') ? 
'Product details for ' + productDetails.ProductName : '' "

这样 JAWS/NVDA/Narrator 就可以读取它的值是否存在..

Answer 4

这对我有用 没有[]。

attr.aria-labelledby="navbarDropdownMenuLink{{ i }}"