角度 2 和自定义下拉菜单

Question

我正在为角度 2 创建一个功能区组件（本质上是为了学习角度 2 ^^），我想知道如何以角度 2 的方式制作下拉菜单。当然，我可以使用引导甚至jQuery，但我想知道从我的组件中做到这一点的最佳方法是什么。事实上，我可以在我的 TypeScript 文件中做一个方法，它可以做一些事情：

("my-dom-menu").slideDown()

但是，我知道在 Angular 1 中，直接从控制器内部弄乱 DOM 并不是最佳实践，所以我想 angular 2 仍然如此。

创建一个应该在我单击按钮时显示菜单的指令会是一个更好的主意吗？从指令中弄乱 DOM 比从组件中弄乱 DOM 更好吗？

谢谢

Answer 1

您的菜单将是一个组件。

import {Component} from '@angular/core';
@Component({
   selector:'my-drop-down-menu',
   templateUrl:'./my-drop-down-menu.html' // this is where you would add the div
})
export class MyMenuComponent{
    // actions happen here
}

.html

<my-drop-down-menu></my-drop-down-menu> <-- pulls in my-drop-down-menu.html -->

如果您通过 angular.io 教程，您将立即获得它 https://angular.io/docs/ts/latest/tutorial/