Angular 是否以相同的方式处理插值和一种方式绑定？答案

【问题标题】：Does Angular handle interpolation and one way binding the same way?Angular 是否以相同的方式处理插值和一种方式绑定？
【发布时间】：2019-09-06 03:49:53
【问题描述】：

我目前正在创建一个经常更改页面上的文本和图像的应用程序。运行几个小时后，Chrome 几乎消耗了整个 CPU。请注意，如果出现此问题，不能只重启浏览器。

我现在尝试禁用 UI 渲染，只从服务器接收数据更新，问题似乎消失了。

<img class="icon" src="{{myIcon1}}"/>
<img class="icon" [src]="myIcon2"/>

Angular 是否只更新第一行的“src”属性，就像第二行一样，或者如果“myIcon1”发生变化，它是否总是创建整个组件模板的完整新实例？

【问题讨论】：

【解决方案1】：

尽管插值和数据绑定是相互交替的。但是它们之间的关键区别在于，如果我们可以在插值情况下连接字符串。myIcon1 = "sample.jpg"; <img class="icon" src="https://www.sample/{{myIcon1}}"/>

属性绑定用于将元素属性设置为非字符串数据值

    <button [disabled]='isDisable'>Click Me</button>

更改禁用属性将相应地禁用/启用按钮。但是如果我们使用

    <button disabled='{{isDisable}}'>Click Me</button>

无论 isDisable 属性如何，按钮都将始终处于禁用状态

【讨论】：

【解决方案2】：

我认为它更新了虚拟 DOM，作为回报，它从头开始渲染整个界面。但是使用 Angular 8，他们正在实现一个增量 DOM。我在这个网站上读到过。

【讨论】：