3.6 Скринкаст по Angular – Компоненты и директивы – Структурная директива

YOUTUBE · 19.11.2025 05:56

Ключевые темы и таймкоды

Введение в структурные директивы

0:00
  • В видео рассказывается о структурных директивах в Angular, которые отличаются от обычных директив тем, что они могут изменять свойства элемента, добавлять или удалять элементы из DOM.

Создание структурной директивы

0:37
  • Создается директива с именем "del", которая добавляет элемент на страницу через некоторое время.
  • В конструкторе директивы подключаются сервисы: TemplateRef, TemplateRef и ViewContainerRef.

Использование структурной директивы

1:37
  • Демонстрируется использование директивы "del" на компоненте, где она добавляет элемент через две секунды.
  • Можно сделать задержку параметром и использовать его для добавления элемента через определенное время.

Создание коллекции структурных директив

2:22
  • Создается коллекция структурных директив "del", которая выводит компонент с каждой новой директивой.
  • Демонстрируется анимация, где каждый элемент добавляется через секунду.

Работа под капотом

6:22
  • Объясняется, что Angular переписывает код компонента на основе структурной директивы, используя синтаксический сахар.
  • Темплейт - это содержимое компонента, а ViewContainerRef - это сам энджи темплейт.