2

我有一些 Angular 2 中组件和指令的继承和装饰（如装饰器模式）的用例。

该示例是具有不适合这种情况的基本模板的组件，以至于定义新模板而不是以编程方式修改现有模板的 DOM 更容易。其余的组件元数据应该被继承。

基本上是

export const BASE_SOME_COMPONENT_METADATA = { ... };

@Component(BASE_SOME_COMPONENT_METADATA);
export class BaseSomeComponent { ... }

...

import { BaseSomeComponent, BASE_SOME_COMPONENT_METADATA } from '...';

@Component(Object.assign({}, BASE_SOME_COMPONENT_METADATA, { template: '...' });
export class SomeComponent extends BaseSomeComponent {}

更复杂的情况是

@Component({ ... });
export class ThirdPartyComponent {
  @Input() ...;
  @Input() ...;
  @Input() ...;
  ...
}

...

import { ThirdPartyComponent as BaseThirdPartyComponent } from '...';

@Component({
  // may modify or replace any of the original properties
  template: ...,
  styles: ...
  ...
});
export class ThirdPartyComponent extends BaseThirdPartyComponent {}

请注意，它ThirdPartyComponent有许多输入。在某些情况下，在内部修改组件而不是包装它并从外部修改其行为是有益的。在模板中枚举它们并将它们传输到ThirdPartyComponent可能是 WET 和脏的包装器组件：

<third-party inputs="inputs" that="that" should="should" be="be" enumerated="enumerated">

在某些情况下，可能会禁止包装组件引入的额外布局元素。

ThirdPartyComponent可能是其他第三方组件使用的核心组件（按钮）。然后它们也应该受到影响，因此可能需要在整个注入器上“装饰装饰器”，而不仅仅是扩展它。

在 Angular 1.xthirdPartyDirective中，提供了对组件 DDO 的完全访问权限的服务，因此可以对它们进行修饰、扩展、油炸等。Angular 2 中这种方法的直接对应物是什么？如果这违反了某些规则并使保修失效，那没关系。

如何扩展不导出其元数据的组件/指令？

如何修改现有组件的元数据？

4

1 回答 1

2

您的输入将自动从父类继承。关于Component装饰器本身的属性，Angular2 中没有本地方法可以做到这一点。Angular2 团队不会为此提供支持：https ://github.com/angular/angular/issues/7968#issuecomment-219865739 。

如果您真的想要这样的东西，您需要使用更新注释的自定义装饰器来实现......

这篇文章可能会让您感兴趣：

于 2016-06-28T16:01:06.630 回答