Шаблонныя зменныя ў Angular

У Angular можна атрымаць доступ да тэгаў старонкі з дапамогай шаблонных зменных. Яны дазваляюць прывязаць тэг да зменнай і спасылацца на яго падчас працы компанента. Для таго, каб аб'явіць такую зменную, трэба перад яе імем паставіць знак #.

Давайце паглядзім на практыцы. Хай, да прыкладу, у нас ёсць дыў. Запішам яго ў шаблонную зменную:

app/app.component.html<div #userName>
  text
</div>

Цяпер у зменнай userName будзе ляжаць спасылка на DOM элемент нашага дыва. І мы можам звяртацца з ёй так, як гэта робіцца ў чыстым JavaScript. Напрыклад, давайце вывядзем тэкст гэтага дыва ў іншым тэгу:

app/app.component.html<div>
  {{ userName.textContent }}
</div>
Задание 1

Дадзены дыў. Дадзеная выява. Запішыце спасылку на выяву ў шаблонную зменную. Вывядзіце src нашай выявы ўнутры дыва.