angular - 如何在 Angular 2 中创建一个数组或一组指令

Question

我目前有一个带有组件和指令的模块，它支持我的 Angular 2 应用程序中的组件。为了让用户使用这个组件，他们必须导入组件和指令。有没有一种方法可以将它们分组为 ROUTER_DIRECTIVES

例如:

import {Component, HostListener, Directive} from "angular2/core";

@Component({
    selector: "my-dropdown",
    templateUrl: "./dropdown.html",
    styleUrls: ["./dropdown.css"]
})
export class Dropdown {
    //code
}

@Directive({
    selector: ".my-dropdown-toggle"
})
export class DropdownToggle{

    //code
}

要使用这个，用户必须像这样导入:

@Component({
    moduleId: module.id,
    directives: [Dropdown,DropdownToggle,ROUTER_DIRECTIVES],
    templateUrl: "./dropdown-sample.html"
})
export class DropdownAngularDemo {
}

我想知道是否可以将 Dropdown 和 DropdownToggle 组合成一个数组，如 ROUTER_DIRECTIVES

Answer 1

ROUTER_PROVIDERS被声明为

export const ROUTER_PROVIDERS: any[] = CONST_EXPR([
  ROUTER_PROVIDERS_COMMON,
  CONST_EXPR(new Provider(PlatformLocation, {useClass: BrowserPlatformLocation})),
]);

你可以用你自己的指令做同样的事情

export const DROPDOWN_DIRECTIVES: any[] = CONST_EXPR([
  Dropdown,
  DropdownToggle
]);

像这样使用它

import {DROPDOWN_DIRECTIVES} from 'somedir/somefile';

@Component({
    moduleId: module.id,
    directives: [DROPDOWN_DIRECTIVES,ROUTER_DIRECTIVES],
    templateUrl: "./dropdown-sample.html"
})
export class DropdownAngularDemo {
}

您还可以创建指令组(或提供程序组)。 Angular 自己扩展嵌套数组(不需要使用 spread operator )。

export const MY_DIRECTIVES: any[] = CONST_EXPR([
  DROPDOWN_DIRECTIVES,
  ModalDialog,
  MainMenu
]);