Angular2：如何覆盖组件模板？

【问题标题】：Angular2: How to override components template?Angular2：如何覆盖组件模板？
【发布时间】：2016-08-08 13:40:09
【问题描述】：

我正在考虑将 angular 1.4 应用程序迁移到 angular 2，我想知道是否可以像在 angular1 中那样使用 $provide.decorator 覆盖组件的模板（如 Can you override specific templates in AngularUI Bootstrap?）。

我正在寻找类似 TestComponentBuilder.overrideTemplate 之类的东西，但用于非测试场景。 Angular2 有类似的东西吗？

【问题讨论】：

你的意思是用几个不同的模板重用一个组件？
当然可以，请看answer。
谢谢，不幸的是，我想要覆盖其模板的大部分组件来自第三方库（即 angular-ui）。
我相信可能会有类似link

标签： angular templates overriding

【解决方案1】：

从 stackoverflow Override/extend third-party component's template 查看这个答案。主要思想是您可以编写自己的组件并扩展第三方组件。

import {component} from 'angular2/core';
import {thirdPartyClass} from 'example/example';

@Component({
  selector: 'my-selector',
  template: '<div>my template</div>'
})

export class MyOwnComponent extends thirdPartyClass {
  constructor() {
     super()
  }
}

但也有缺点：

它仍然会编译原始组件。
如果您使用此方法，请不要忘记导入任何管道在 thirdPartyClass 模板中使用。
如果功能在依赖的第三方类中更新在模板上，您需要手动更新。

订阅此Github Issue 以获取更多更新。

【讨论】：

修复了问题。