Javascript 扩展/装饰Angular 2组件和指令

我有一些用于Angular 2中组件和指令的继承和修饰（如Decorator模式）的用例

示例是带有基本模板的组件，它不适合这种情况，因此定义新模板比以编程方式修改现有模板的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

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

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

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

ThirdPartyComponent

可能是其他第三方组件使用的核心组件（按钮）。然后它们也会受到影响，因此可能有必要在整个喷油器上“装饰”，而不仅仅是延长喷油器

在Angular 1.x

thirdPartyDirective

中，是一种提供对组件DDOs的完全访问权限的服务，因此可以对组件DDOs进行修饰、扩展、深度处理等。Angular 2中这种方法的直接对应物是什么？如果这违反了一些规则并使保修无效，那没关系

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

---

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

您的输入将自动从父类继承。关于

组件

装饰器本身的属性，在Angular2中没有实现这一点的原生方法。Angular2团队不会为此提供支持：

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

您可能会对本文感兴趣：

---

输入问题是指在模板中强制执行

的包装器组件。我在Ng中分享了这些属性，最后在

compile

中以编程方式添加属性。我正在尝试找出在Ng2中有效地做这些事情的方法。顺便说一句，非常好的阅读，谢谢你的链接。事实上，我发现你回答了大部分问题。