我在Angular 5中有一个组件<my-component>
@Component({
selector: 'my-component',
templateUrl: './my.component.html',
styleUrls: ['./my.component.css']
})
export class MyComponent {
click(param: string){
console.log(param);
}
在我的HTML中,我有类似的东西:
<my-component (click)="click('Hello world')"></my-component>
我需要覆盖执行的click函数:
console.log('Param: ' + param);
我该怎么办?
答案 0 :(得分:2)
在你的app.module.ts
中TransformAsync()
您的OriginalComponent
import { OriginalComponent } from './original/original.component';
import { MockOfOriginalComponent } from './mock/mock-of-original.component';
@NgModule({
declarations: [
AppComponent,
WelcomeComponent,
OriginalComponent,
MockOfOriginalComponent
],
providers: [],
imports: [
BrowserModule,
HttpClientModule,
RouterModule.forRoot([
{ path: 'welcome', component: WelcomeComponent },
{ path: 'pm-mock-of-original', component: MockOfOriginalComponent },
{ path: 'pm-original', redirectTo: 'pm-mock-of-original' },
]),
],
bootstrap: [AppComponent]
})
export class AppModule { }
你的MockOfOriginalComponent
@Component({
moduleId: module.id,
selector: 'pm-original',
templateUrl: 'original.component.html',
styleUrls: ['original.component.scss']
})
export class OriginalComponent {
}
技巧是AppModule中的重定向
@Component({
moduleId: module.id,
selector: 'pm-mock-of-original',
templateUrl: 'mock-of-original.component.html',
styleUrls: ['mock-of-original.component.scss']
})
export class MockOfOriginalComponent {
}
我在本地进行了测试,它运行正常。如果没有尝试这个
{ path: 'pm-mock-of-original', component: MockOfOriginalComponent },
{ path: 'pm-original', redirectTo: 'pm-mock-of-original' }
当您从(外部)模块导入两个组件时,这也有效。