Как создать директиву в angular

Читал про то как создать директиву, однако нашёл только про то как воздействовать на css,никак не пойму как применить к html. Нужно реализовать следущую задачу:

Нужно создать директиву [list], применив который к тегу div, появиться меню из переменной x=[‘html’,‘css’,‘js’] т.е. код должен выглядеть так:

x = [“HTML”, “CSS”, “JS”]

<div [list]=”x”>

</div>

в последствии внутри div получим:

<ul>

<li>HTML</li>

<li>CSS</li>

<li>JS</li>

</ul>

буду признателен подробным объяснениям

Ответ наш вопрос подробно расписан в документации https://angular.io/tutorial/toh-pt2