需求: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);// 不能在这里订阅弹窗里事件,会订阅多次!!
}