角2插值vs属性绑定

问题描述：

我知道从多个博客和一些问题在这里在*角1 ng-bind有更好的性能比{{}}插值，因为$消化过程的工作方式。角2插值vs属性绑定

Angular 2已经改变了它的数据绑定方式，我想知道是否有任何测试的主题。具体而言，如果这

<h1 [innerText]="obj.name"></h1>

仍比这个

<h1> {{ obj.name }} </h1>

因为简单的原因'innerText'不能更好，[它不是标准化的]（https://developer.mozilla.org/en-US/docs/Web/API/Node/innerText）。我猜想绑定'textContent'会给你带来Universal的问题。 – estus

答

以getTitle()方法为例。 checkBinding是调试模式检查，可以忽略。

属性绑定调用sanitize和el.setAttribute：

var currVal_0 = self.context.getTitle(); 
    if (jit_checkBinding34(throwOnChange,self._expr_0,currVal_0)) { 
    self.renderer.setElementAttribute(self._el_0,'innerHTML',((self.viewUtils.sanitizer.sanitize(jit_SecurityContext36.HTML,currVal_0) == null)? null: self.viewUtils.sanitizer.sanitize(jit_SecurityContext36.HTML,currVal_0).toString())); 
    self._expr_0 = currVal_0; 
    }

插值，呼吁el.textContent = value;：

var currVal_0 = jit_interpolate36(1,'',self.context.getTitle(),''); 
    if (jit_checkBinding34(throwOnChange,self._expr_0,currVal_0)) { 
    self.renderer.setText(self._text_1,currVal_0); 
    self._expr_0 = currVal_0; 
    }

唯一的区别是使用sanitize，您可以检查html_sanitizer.ts源代码，看看是不一些复杂的东西。

答

更好的插补也是产权在许多情况下，结合一个方便的选择。

实际上，在呈现视图之前，Angular 2会将这些插值转换为相应的属性绑定。

在Angular 2中，我认为没有技术上的理由去选择一种形式。你应该选择感觉最自然的形式。

角2插值vs属性绑定

相关推荐