需求:ngalain 和 ng-zorro 只提供了关闭事件向父组件传值,但我需要的是弹窗打开时,点击列表某一行即向父祖件传当前行信息
新建modal.service.ts
import { EventEmitter, Injectable } from '@angular/core';
// 从根注入
@Injectable({
providedIn: 'root',
})
// 这种写法需要在x.module.ts providers 里注入
// @Injectable()
export class ModalServcie {
private modal_emitter = new EventEmitter();
constructor() {}
getModalEmitter() {
return this.modal_emitter;
}
emitModalData(data) {
this.modal_emitter.emit(data);
}
}
modal.component.ts 弹窗里调用:
import { ModalServcie } from '@shared/services/modal.service';
export class SearchTagsComponent implements OnInit {
constructor(private modalServcie: ModalServcie) {}
tags = [];
addTags() {
this.modalServcie.emitModalData(this.tags);
}
}
父组件里接受:
import { ModalServcie } from '@shared/services/modal.service';
import { ModalHelper } from '@delon/theme';
import { ModalComponent } from '../modal/modal.component';
constructor(private modalServcie: ModalServcie,private subject: ModalHelper) {
// 订阅弹窗里事件
this.modalServcie.getModalEmitter().subscribe(data => console.log(data));
}
addTag() {
// 创建弹窗
this.subject.create(ModalComponent);
// 不能在这里订阅弹窗里事件,会订阅多次!!
}