AngularJS “{{}}” insite title attribute isn't working

Question

I using this HTML & AngularJS code:

<td class="domain-col" ng-init="msg='error message'">
    <span class="label label-warning" ng-show="page.ErrorCode == 11" data-toggle="tooltip" title="{{ msg }}">Error</span>
</td>

This code is working inside ng-repeat in order to generate rows in table. Each row in the table is represented with page object. Each page has ErrorCode .

On ng-init I converting the error code to user friendly UI message, which will be printed to title attribute.

The problem is that instead print the error message into title attribute, the value of this attribute became "{{ msg }}". The value of title attribute after running the code:

• Actual : "{{ msg }}" string.
• Expected : "error message".

Why this happens? How to fix this?

Answer 1

You could use ng-attr-*="{{expression}}" directive here, in which * means attributeName , So basically what it does is. evaluated expression from interpolate and add evaluated value in that attribute.

ng-attr-title="{{msg}}"

Answer 2

您可以使用 ：

ng-attr-title="{{msg}}"