Що таке шаблонна прив'язка (template binding)?
В Angular шаблонна прив'язка (template binding) - це механізм, за допомогою якого дані з компонента зв'язуються з HTML-шаблоном і навпаки. Вона дозволяє динамічно відображати дані, реагувати на події та керувати властивостями елементів.
Основні види шаблонної прив'язки
- Інтерполяція (
{{ }}) - вставка значення властивості компонента в текст шаблону.
<p>{{ username }}</p>Значення username з компонента підставляється в <p>.
2. Прив'язка властивостей ([property]) - зв'язує властивість DOM-елемента або компонента з виразом.
<img [src]="userPhotoUrl">Значення userPhotoUrl з компонента призначається атрибуту src.
3. Прив'язка подій ((event)) - зв'язує подію DOM з методом компонента.
<button (click)="submitForm()">Надіслати</button>Метод submitForm() викликається при кліку на кнопку.
4. Двостороння прив'язка ([(ngModel)]) - об'єднує прив'язку властивості та події для синхронізації даних.
<input [(ngModel)]="userName">Будь-яка зміна в input одразу відображається в userName і навпаки.
Тобто шаблонна прив'язка - це засіб зв'язку моделі компонента та інтерфейсу, який робить відображення динамічним та інтерактивним.
Коротка відповідь
Для співбесідиКоротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.