[解決済み] Aタグのtitle属性にAngularJSをバインドさせるには？

質問

サムネイルのツールチップに商品名を表示させることを意図しています。 ブラウザは "ng-title" または "ng-attr-title." からツールチップを作成しません。

AngularJSのバージョン1.0.7を使用しています。 任意の属性の前に "ng-" または "ng-attr" を付けることができ、Angular はそれに応じてバインドします。しかし、HTMLの "A" タグの title 属性には "bind" してくれないようです。

例 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 を表示することも、ツールチップを表示することもできません。

どのように解決するのですか？

以下のようになります。 ng-attr は新しいディレクティブで AngularJS 1.1.4 の新しいディレクティブで、おそらくこのケースで使うことができます。

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

しかし、1.0.7 のままであれば、おそらく効果を反映するカスタムディレクティブを書くことができます。