Question

我一直在阅读angular.io指南并遇到the section on the NgClass directive。在提供的示例中，ngClass的源是组件函数：

// HTML
<div [ngClass]="setClasses()">This div is saveable and special</div>

// Controller
setClasses() {
  let classes =  {
    saveable: this.canSave,      // true
    modified: !this.isUnchanged, // false
    special: this.isSpecial,     // true
  };
  return classes;
}

考虑到这在摘要周期中是否会产生很大的开销该指令不知道函数的结果何时发生了变化会在每个摘要周期中触发对功能的新评估吗？在对比我希望以下代码提供相同的功能但只能在其中一个观测值具体时重新评估改变了（canSave，isUnchanged，isSpecial）。

<div [ngClass]="{ saveable : canSave, modified : !isUnchanged, special: isSpecial }">This div is saveable and special</div>

有人可以说明我应该考虑的内容优化表现？一个示例用例是将此ngClass打开一个在可见页面上创建~200个元素的ngRepeat。

作为一个侧面节点和较小的问题，我想知道是否有任何好处学习一次性绑定的资源（在angular2与angular1中）。该指南似乎没有涵盖这一点，我希望有一个异步的时间绑定在angular2中可用。

Answer 1

这是否会在摘要周期中产生很大的开销，因为该指令不知道函数的结果何时发生了变化，并且会在每个摘要周期中触发对函数的新评估？相反，我希望以下代码提供相同的功能，但只在其中一个观察值发生变化时才进行重新评估（canSave，isUnchanged，isSpecial）。

你的结论是正确的。

setClasses方法为每个调用返回一个不同的实例，这使ngClass中的比较更加昂贵。如果没有依赖项更改，则返回相同的实例，然后绑定到此方法方式很好。

最近这个问题已得到解决。 https://github.com/angular/angular.io/issues/3072

作为一个侧面节点和较小的问题，我想知道是否有任何好的资源来学习一次性绑定（在angular2与angular1中）。该指南似乎没有涵盖这一点，我希望在angular2中有一个异步的一次性绑定。

Angular2不支持一次性绑定。

角度绑定到功能结果

1 个答案: