要实现自定义下拉菜单，可以使用Angular的自定义指令。

首先，创建一个新的Angular指令，用于控制下拉菜单的显示和隐藏。在指令中，可以使用@HostListener装饰器监听宿主元素的点击事件，并在点击时切换下拉菜单的显示状态。

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

@Directive({
  selector: '[appDropdown]'
})
export class DropdownDirective {
  private isOpen = false;

  constructor(private el: ElementRef, private renderer: Renderer2) { }

  @HostListener('document:click', ['$event'])
  toggleDropdown(event: Event) {
    if (this.el.nativeElement.contains(event.target)) {
      this.isOpen = !this.isOpen;
    } else {
      this.isOpen = false;
    }

    if (this.isOpen) {
      this.renderer.addClass(this.el.nativeElement, 'open');
    } else {
      this.renderer.removeClass(this.el.nativeElement, 'open');
    }
  }
}

接下来，在使用下拉菜单的组件中，可以使用自定义指令来控制下拉菜单的显示和隐藏。在组件的模板中使用appDropdown指令，并给下拉菜单添加一个类名（这里使用dropdown-menu）。

  Toggle dropdown
  

    
Item 1
    
Item 2
    
Item 3
  

最后，可以在CSS中创建一个.open类，用于控制下拉菜单的显示样式。

.open .dropdown-menu {
  display: block;
}

这样，当点击按钮时，下拉菜单会显示或隐藏。

注意：在使用自定义指令之前，需要将其添加到模块的declarations数组中，以便Angular能够识别并使用该指令。

import { DropdownDirective } from './dropdown.directive';

@NgModule({
  declarations: [
    DropdownDirective
  ],
  // ...
})
export class AppModule { }

这就是使用Angular实现自定义下拉菜单的方法。希望对你有所帮助！