javascript - Angular 冗余数据绑定(bind)？

Question

我是现在公司的新人，正在重构我前任的代码。

<th ng-repeat="(key,headline) in model.headlines" ng-class="headline.classes" data-ng-bind="headline.name">
    {{headline}}
</th>

我发现删除 {{headline}} 没有任何改变(或添加任何东西，例如向对象的内容添加文本也没有任何改变)。

删除 data-ng-bind="headline.name" 并将 {{headline}} 替换为 {{headline.name}} 使我能够像在任何其他 html 对象中一样添加更多内容。

由于我是 Angular 的新手，而且我认为我的前任很能干，与“内联版本”{{headline.name}} 相比，data-ng-bind="headline.name"有什么好处吗？

我想为对象添加额外的样式并将另一个 div 放入其中会很棒，但我不能使用 data-ng-bind 来做到这一点，因为它会吃掉内容并只是替换它。

这个改变会不会把事情搞砸？

我很困惑为什么更有经验的前任会以一种首先使其不那么敏捷的方式编写代码，所以我想仔细检查一下，我没有忽略任何东西。

<th ng-repeat="(key,headline) in model.headlines" ng-class="headline.classes"">
    <div ng-class="additional styling">
        {{headline.name}}
    </div>
</th>

Answer 1

{{...}} 在初始化时有一些性能开销，但实际上可以忽略不计。在实践中，不同之处在于 ng-bind 将始终替换元素的内容，其中 {{...}} 你只设置了它的一部分，所以您仍然可以附加或前置元素。

最后，它比任何东西都更受欢迎，如果我知道这就是我想要的元素内容，我倾向于使用 ng-bind。