AngularJS:如何为HTML5数据属性使用ng-bind/ng-bind-template

Question

在我的代码中，我有一个按钮，我使用HTML5数据属性和AngularJs表达式将数据附加到按钮上，以向它显示通知。代码如下所示

<button type="button" 
        class="btn btn-link navbar-btn" 
        data-notifications={{tweetCount}}> 
    <span class="twitter-edit" ></span>
</button>

但是使用expression的缺点可以在here中找到。因此，很明显，解决方案是使用ng-bind或ng-bind-template。

但是如何对HTML5的数据属性执行此操作，因为在我的CSS中，我为data-notification声明了样式为，

[data-notifications]:after {
content: attr(data-notifications);
position: absolute;

top:1.75em;
right: -0.5em;
.
.
.
}

欢迎对此问题提出任何建议。

-EDIT我想对我的问题有些误解。上面显示{{tweetCount}}的代码很适合我。唯一的问题是，在页面加载的瞬间，double curlies实际上会显示给用户。要解决此问题，建议使用ng-bind/ng-bind-template。但在我的例子中，我必须将它应用于HTML5的数据属性标记。那该怎么做呢？

Answer 1

我想你只是错过了手柄周围的引号。

<button type="button" 
    class="btn btn-link navbar-btn" 
    data-notifications="{{tweetCount}}"> <---quotes around the handle-bars
  <span class="twitter-edit" ></span>
</button>