2017-03-20 71 views
1

我正在查看ngx-translates两种给予翻译输入的方式。Angular 2不纯管vs指令性能

  1. 无论是作为一个管{{'messageId' | translate}}
  2. 或作为指令<span [translate]="'messageId'">

管道是不纯的管道,可处理翻译和文字的任何异步加载。我看到的这种方法的缺点是,每当摘要循环运行时,都会触发它。

另一种方法是使用指令。在这种情况下,我们可以通过使用Events或Observables来控制何时触发这些方法。这种方法可以减少不必要的更新。

但由于指令操纵DOM,我的问题是指令的方法会让整体变慢吗?另外,有没有办法衡量一个人的表现?

回答

3

Angular插值语法上的糖是属性绑定的。如文档中解释,如果你看到绑定财产性利益,去了这两个是相同的

<p><span>"{{title}}" is the <i>interpolated</i> title.</span></p> 
<p>"<span [innerHTML]="title"></span>" is the <i>property bound</i> title.</p> 

左右。

+0

问题是,'[translate]'指令不仅仅是绑定。它仍然需要写入DOM。 'node.textContent = this.key? node.currentValue:node.originalContent.replace(key,node.currentValue); this._ref.markForCheck();' 这是用在他们的[源代码](https://github.com/ngx-translate/core/blob/master/src/translate.directive.ts),会这比属性绑定慢吗? – nipuna777

+0

我相信插值也需要像使用相同的绑定基础结构一样。 – Chandermani