javascript - AngularJS - TD 元素中标题属性中的多个 {{ }}

Question

我在使用带有多个 {{ }} 的 AngularJS 显示带有 title 属性的工具提示时遇到问题。 我正在制作一种日历。

我有这个:

        <tr ng-repeat="horaire in triPlan(planning)">
            <td>A</td>
            <td class="abraca" ng-click="selectionHoraire(horaire)" ng-repeat="rdv in horaire" data-toggle="tooltip" data-placement="left" 
            title="{{rdv.nom}} is {{rdv.age}} year old">{{rdv.nom}}</td>
        </tr>

但是当我将鼠标悬停在 TD 元素上时，它会显示“{{rdv.nom}} 是 {{rdv.age}} 岁”。如果我在 title 属性中只放置一个 {{ expression }} ，它就可以完美地工作。

如何在此标题属性中放置多个 {{ }} 表达式？

更新:问题已解决

您可以在下面的答案和评论中看到我使用的是 1.6.4 AngularJS 版本。

ng-attr-title 在 ng-repeat 本身内部的 ng-repeat 中对我不起作用。所以，我不知道为什么，但经过一些测试，我输入了这行代码:

<script src="https://code.angularjs.org/1.2.9/angular.min.js"></script>

我很惊讶地发现它有效! title="{{rdv.nom}} 已 {{rdv.age}} 岁">{{rdv.nom}}

版本之间存在一些差异，我不知道为什么在旧版本中它可以工作，而在新版本中却不能。

感谢@georgeawg，终于得到了让它发挥作用的结果。 是将两个或多个插值合并为一个(文本是法语，不用担心):

title="{{rdv.nom+' a l\'âge :  '+rdv.age+' et vient pour : '+rdv.text}}"

谢谢大家!

Answer 1

使用ng-attr-title。 来自 angularJS documentation :

Web browsers are sometimes picky about what values they consider valid for attributes.

If an attribute with a binding is prefixed with the ngAttr prefix (denormalized as ng-attr-) then during the binding it will be applied to the corresponding unprefixed attribute. This allows you to bind to attributes that would otherwise be eagerly processed by browsers...

<td class="abraca" ng-click="selectionHoraire(horaire)" 
    ng-repeat="rdv in horaire" data-toggle="tooltip" data-placement="left" 
        ng-attr-title="{{rdv.nom}} is {{rdv.age}} year old">{{rdv.nom}}</td>