Разница между интерполяцией и привязкой к свойствам
У меня есть компонент, который определяет свойство imageUrl и в моем шаблоне я использую это свойство для установки URL- imageUrl изображения. Я пробовал это, используя интерполяцию и используя привязку свойств, оба работают, но я не могу найти различий между ними или когда использовать один над другим. Кто-нибудь знает разницу?
<img [src]='imageUrl' >
<img src= {{ imageUrl }} >
Ответы
Ответ 1
Angular оценивает все выражения в двойных фигурных скобках, преобразует результаты выражения в строки и объединяет их с соседними литеральными строками. Наконец, он присваивает этот составной интерполированный результат элементу или свойству/компоненту. - от https://angular.io/docs/ts/latest/guide/template-syntax.html#!#interpolation
Связывание свойств не преобразует результат выражения в строку.
Поэтому, если вам нужно связать что-то другое, кроме строки, с вашим свойством directive/component, вы должны использовать привязку свойств.
Ответ 2
Интерполяция использует {{выражение}} для отображения связанного значения с шаблоном компонентов. Интерполяция - это особый синтаксис, который Angular преобразует в привязку свойства
Связывание свойств использует [] для отправки значений из компонента в шаблон. Связывание свойств: чтобы установить свойство элемента в значение, отличное от строки, вы должны использовать привязку свойств
Пример:
мы отключаем кнопку, связывая с Boolean свойство isDisabled.
<button [disabled]='isDisabled'>Try Me</button>
интерполяция вместо привязки к свойствам, кнопка всегда будет отключена независимо от значения свойства класса isDisabled.
<button disabled='{{isDisabled}}'>Try Me</button>
каноническая форма, которая является альтернативным синтаксисом квадратной скобки.
<button bind-disabled='isDisabled'>Try Me</button>
