Блог

Я следую курсу Udemy по angular. Я добавил директиву выпадающего списка, как показано ниже

 import { Directive, HostBinding, HostListener } from '@angular/core';

@Directive({
selector:'[appdropdown]'
})
export class DropDownDirective
{
@HostBinding('class.open') isOpen=false;

@HostListener('click') dropdownClick()
{
    this.isOpen = !this.isOpen;
}
}
 

И добавил его в массив объявлений в AppModule. Когда я добавляю его в div в компоненте app-recipe-detail, когда я нажимаю на кнопку, я не открываю раскрывающийся список

 <div class="row">
<div class="col-md-12">
    <div class="btn-group" appdropdown>
        <button type="button" class="btn btn-primary dropdown-toggle" >
            Manage Recipe <span class="caret"></span></button>
            <ul class="dropdown-menu">
                <li>
                    <a href="#">To List</a>
                </li>
                <li>
                    <a href="#">Edit Recipe</a>
                </li>
                <li>
                    <a href="#">Delete Recipe</a>
                </li>
            </ul>
    </div>
</div>
 

Я не могу понять, чего не хватает.