import { Component, Input } from '@angular/core';
|
import { NzModalSubject, NzModalService, NzMessageService } from 'ng-zorro-antd';
|
import { ModalHelper } from '@delon/theme';
|
|
@Component({
|
selector: 'app-model-custom',
|
template: `
|
<div class="modal-header">
|
<div class="modal-title">Custom component</div>
|
</div>
|
<h3>From Custom Componetn!</h3>
|
<p>Input Data: {{name}}</p>
|
<p>submodal: <a (click)="show()">show</a></p>
|
<p>
|
Popconfirm 气泡确认框：
|
<nz-popconfirm [nzTitle]="'确定要删除这个任务吗？'">
|
<a nz-popconfirm>删除</a>
|
</nz-popconfirm>
|
</p>
|
<div class="modal-footer">
|
<button nz-button [nzType]="'default'" [nzSize]="'large'" (click)="cancel()">
|
Cancel
|
</button>
|
<button nz-button [nzType]="'primary'" [nzSize]="'large'" (click)="ok()">
|
OK
|
</button>
|
</div>
|
`
|
})
|
export class ModelCustomComponent {
|
|
@Input() name: string;
|
|
constructor(
|
private modalHelper: ModalHelper,
|
private model: NzModalService,
|
private msg: NzMessageService,
|
private subject: NzModalSubject) {}
|
|
show() {
|
this.modalHelper
|
.open(ModelCustomComponent, { name: 'From Submodal Data' }, 'sm', {
|
zIndex: 1001 // https://github.com/NG-ZORRO/ng-zorro-antd/issues/317
|
})
|
.subscribe(result => this.msg.info(`subscribe sub status: ${JSON.stringify(result)}`));
|
}
|
|
ok() {
|
this.subject.next(`new time: ${+new Date}`);
|
this.cancel();
|
}
|
|
cancel() {
|
this.subject.destroy();
|
}
|
}
|
