Javascript 使用AngularJS将元素文本复制到title属性的干净方法

我在一张桌子上有这样的东西：

<tr ng-repeat="book in books">
  <td title="{{book.title}}">{{book.title}}</td>
  <td title="{{book.author}}">{{book.author}}</td>
</tr>

{{book.title}}
{{book.author}}

我使用CSS在溢出时显示省略号，我希望在悬停时显示工具提示，显示单元格的全部预期内容，从而使用title属性。在上面的例子中，这并不太糟糕，但在其他情况下，我有更复杂的带有过滤器的AngularJS表达式，我讨厌在contents和title属性中重复同样的事情

我可以使用某种AngularJS魔术（也许是指令？）将生成的元素内容自动复制到title属性中（或者反之亦然），如果可以，我该如何做

---

很抱歉，如果这是一个新手问题，但我是AngularJS新手，我的Google试图找到一个解决方案时遇到了问题。

您可以编写一个非常简单的指令，只需获取内部内容并将其设置为标题：

app.directive('contentTitle', function($timeout) {
    return {
        link: function(scope, element) {
            $timeout(function() {
                element[0].title = element[0].textContent;
            });
        }
    };
});

然后像这样使用它：

<tr ng-repeat="book in books">
    <td content-title>{{book.title}}</td>
    <td content-title>{{book.author}}</td>
</tr>

{{book.title}}
{{book.author}}

注1：我将代码包装到

$timeout

中，以确保在正确插入元素内容后运行它

注2：如果您支持IE8，则应使用innerText，然后跨浏览器方式为

元素[0].textContent | |元素[0].innerText

---

演示：您的意思是将

替换为“始终可以使用工具提示指令从元素复制html”。应该很容易在谷歌搜索中找到多个版本，问题是我不想在标题和内容中重复相同的可能很长的表达式。在这个例子中，这并不坏，但我有类似{{book.date | dateFormat | missing:'notpresent'}这样的情况。我试着跟着干。