[英]How to bind parent component using child component's event property using `lazy loading` in Angular 9
I am converting some components to be lazily loaded
using the ivy compiler
in Angular 9.我正在使用 Angular 9 中的
ivy compiler
将一些组件转换为lazily loaded
。
This is my code at the moment:这是我目前的代码:
<bulk-user-upload [visible]="bulkUserUploadVisible (fileUploaded)="onBulkUserUploadFileUploaded($event)">
and I am trying to modify the code become like this:我试图修改代码变成这样:
<ng-container #bulkUserUpload></ng-container>
I want to access the fileUploaded
function that exists in the child component so I can listen the event on the parent component.我想访问子组件中存在的
fileUploaded
函数,以便我可以监听父组件上的事件。
const { BulkUserUploadComponent } = await import('../bulk-user-upload/bulk-user-upload.component');
const bulkUserUploadFactory = this.cfr.resolveComponentFactory(BulkUserUploadComponent);
const { instance } = this.bulkUserUploadContainer.createComponent(bulkUserUploadFactory, null, this.injector);
instance.visible = true;
How do I modify the code above so that I can access child the function?如何修改上面的代码以便我可以访问子函数?
So I added this to my parent component所以我将它添加到我的父组件中
instance.fileUploaded.pipe(
takeUntil(instance.destroy$)
).subscribe(resp => this.onBulkUserUploadFileUploaded(resp));
and this to the child destroy$ = new Subject();
这给孩子
destroy$ = new Subject();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.