Question

目的是让产品名称出现在缩略图的工具提示中。浏览器不会从“ng-title”或“ng-attr-title”创建工具提示。

我们正在使用AngularJS 1.0.7版。您可以在“ng-”或“ng-attr”前添加任何属性，Angular将相应地绑定。但是，它似乎没有“绑定”HTML“A”标记的标题属性。

实施例。 1。

代码：<a title="{{product.shortDesc}}" ...>

预期结果：<a title="Canon Powershot XS50 12MB Digital Camera" ...>

实际结果：<a title="{{product.shortDesc}}" ...>我们在工具提示中收到了不受欢迎的大括号。

实施例。 2。

代码：<a ng-attr-title="{{product.shortDesc}}" ...>

预期结果：<a title="Canon Powershot XS50 12MB Digital Camera" ...>

实际结果：<a ng-attr-title="Canon Powershot XS50 12MB Digital Camera" ...>

我们没有得到明确的title地址，也没有获得有效的工具提示。

Answer 1

看起来ng-attr是AngularJS 1.1.4中的新指令，在这种情况下您可以使用它。

<!-- example -->
<a ng-attr-title="{{product.shortDesc}}"></a>

但是，如果你保持1.0.7，你可以编写一个自定义指令来反映效果。

Answer 2

有时候不希望在title属性或任何其他属性上使用插值，因为它们在插值发生之前被解析。所以：

<!-- dont do this -->
<!-- <a title="{{product.shortDesc}}" ...> -->

如果带有绑定的属性以ngAttr前缀为前缀（非规范化为ng-attr-），则绑定期间将应用于相应的无前缀属性。这允许您绑定到浏览器急切处理的属性。仅在绑定完成时才设置该属性。然后删除前缀：

<!-- do this -->
<a ng-attr-title="{{product.shortDesc}}" ...>

（确保您没有使用早期版本的Angular）。这是使用v1.2.2的演示小提琴：

Answer 3

这里的问题是你的AngularJS版本;由于版本1.1.4中引入了ng-attr，因此title="{{product.shortDesc}}"无效。我不确定为什么ng-attr不适合你，但我想这是出于类似的原因（旧的Angular版本）。我在1.2.9上对此进行了测试，它对我有用。

至于其他答案，这不是<a title="{{product.shortDesc}}" ng-bind="product.shortDesc" />的少数用例！这是一个简单的双卷曲括号：

{{1}}

Answer 4

请看这里的小提琴，以便快速回答

data-ng-attr-title="{{d.age > 5 ? 'My age is greater than threshold': ''}}"

Answer 5

搜索query模型位于ng-controller="whatever"指令定义的范围内。因此，如果要将查询模型绑定到<title>，则必须将ngController声明移动到HTML元素，该元素是正文元素和标题元素的公共父元素：

<html ng-app="phonecatApp" ng-controller="PhoneListCtrl">