angular - 覆盖组件，如服务？

Question

假设我们导入了 Angular Material 模块之一：

 providers:[],
 imports : [MaterialInput]

在里面MaterialInput，有一个使用的组件名为：MaterialInputComponent

由于某些原因，我想用自己的组件覆盖该组件

所以我想说：

 providers:[
    {
       provide: MaterialInputComponent,
       useClass : MyOwnInputComponent
    }
 ],
 imports : [MaterialInputModule]

我知道我们可以覆盖这样的服务，但它也可以用于组件或指令吗？

更新：我不是在寻找组件继承，我想要的是使用类似Material Module但有时我想覆盖它的一些组件行为，就像你对服务所做的那样。

喜欢：

如果这是 MaterialInput 组件背后的原始代码，它位于我的节点模块中。

  @Component({})
  export class OriginalMaterialInputComonent{
        greet(){ alert('Say Aloo'); }
  }

我有一个类似的课程：

  @Component({})
  export class OverrideMaterialInputComonent{

        greet(){ alert('Say yes we can'); } // overriden function
  }

而且，假设我正在导入孔 MaterialInputModule

declarations:[
   {
    provide: OriginalMaterialInputComonent,
    useClass : OverrideMaterialInputComonent
  }
],
  imports : [MaterialInputModule]

那可行吗？

score -1 · Accepted Answer

You can use decorators for that, You can look into the below jsfiddle example

Overriding components

1 回答 1