diff --git a/components/modal/doc/index.en-US.md b/components/modal/doc/index.en-US.md index 5a8cdf1540f..00593de81d9 100644 --- a/components/modal/doc/index.en-US.md +++ b/components/modal/doc/index.en-US.md @@ -43,6 +43,8 @@ The dialog is currently divided into 2 modes, `normal mode` and `confirm box mod | nzClosable | Whether a close (x) button is visible on top right of the modal dialog or not. Invalid value in confirm box mode (default will be hidden) | `boolean` | `true` | | nzOkLoading | Whether to apply loading visual effect for OK button or not | `boolean` | `false` | | nzCancelLoading | Whether to apply loading visual effect for Cancel button or not | `boolean` | `false` | +| nzOkDisabled | Whether to disable Ok button or not | `boolean` | `false` | +| nzCancelDisabled | Whether to disable Cancel button or not | `boolean` | `false` | | nzFooter | Footer content, set as footer=null when you don't need default buttons. 1. Only valid in normal mode.
2. You can customize the buttons to the maximum extent by passing a `ModalButtonOptions` configuration (see the case or the instructions below).
| string
TemplateRef
ModalButtonOptions | OK and Cancel buttons | | nzGetContainer | The mount node for Modal | HTMLElement / () => HTMLElement| A default container | | nzKeyboard | Whether support press esc to close | `boolean` | `true` | diff --git a/components/modal/doc/index.zh-CN.md b/components/modal/doc/index.zh-CN.md index 469c234927d..29dc69dc02e 100644 --- a/components/modal/doc/index.zh-CN.md +++ b/components/modal/doc/index.zh-CN.md @@ -44,6 +44,8 @@ title: Modal | nzClosable | 是否显示右上角的关闭按钮。确认框模式下该值无效(默认会被隐藏) | `boolean` | `true` | | nzOkLoading | 确定按钮 loading | `boolean` | `false` | | nzCancelLoading | 取消按钮 loading | `boolean` | `false` | +| nzOkDisabled | 是否禁用确定按钮 | `boolean` | `false` | +| nzCancelDisabled | 是否禁用取消按钮 | `boolean` | `false` | | nzFooter | 底部内容。1. 仅在普通模式下有效。
2. 可通过传入 ModalButtonOptions 来最大程度自定义按钮(详见案例或下方说明)。
3. 当不需要底部时,可以设为 null
| string
TemplateRef
ModalButtonOptions | 默认的确定取消按钮 | | nzGetContainer | 指定 Modal 挂载的 HTML 节点 | HTMLElement
() => HTMLElement| 默认容器 | | nzKeyboard | 是否支持键盘esc关闭 | `boolean` | `true` | diff --git a/components/modal/nz-modal.component.html b/components/modal/nz-modal.component.html index 65b66009377..30c4ffe0132 100644 --- a/components/modal/nz-modal.component.html +++ b/components/modal/nz-modal.component.html @@ -76,10 +76,10 @@ >{{ button.label }} - - diff --git a/components/modal/nz-modal.component.ts b/components/modal/nz-modal.component.ts index ac621b94727..cec078afece 100644 --- a/components/modal/nz-modal.component.ts +++ b/components/modal/nz-modal.component.ts @@ -103,7 +103,8 @@ export class NzModalComponent extends NzModalRef impleme get cancelText(): string { return this.nzCancelText || this.locale.cancelText; } - + @Input() @InputBoolean() nzOkDisabled: boolean = false; + @Input() @InputBoolean() nzCancelDisabled: boolean = false; @Input() @InputBoolean() nzCancelLoading: boolean = false; @Input() @Output() readonly nzOnCancel: EventEmitter | OnClickCallback = new EventEmitter(); @ViewChild('modalContainer') modalContainer: ElementRef; diff --git a/components/modal/nz-modal.spec.ts b/components/modal/nz-modal.spec.ts index 113be922293..46602526e71 100644 --- a/components/modal/nz-modal.spec.ts +++ b/components/modal/nz-modal.spec.ts @@ -161,6 +161,8 @@ describe('modal testing (legacy)', () => { expect(isButtonLoading(getButtonCancel(modalElement))).not.toBeFalsy(); expect(modalElement.querySelector('.ant-modal-close')).toBeFalsy(); expect(modalElement.querySelector('.ant-modal-mask')).toBeFalsy(); + expect(getButtonOk(modalElement).disabled).toBeFalsy(); + expect(getButtonCancel(modalElement).disabled).toBeFalsy(); // click ok button getButtonOk(modalElement).click(); @@ -690,6 +692,8 @@ class TestBasicServiceComponent { nzOkText: 'custom ok', nzOkType: 'success', nzOkLoading: false, + nzOkDisabled: false, + nzCancelDisabled: false, nzOnOk: () => { console.log('click ok'); return false; }, nzCancelText: 'custom cancel', nzCancelLoading: true, diff --git a/components/modal/nz-modal.type.ts b/components/modal/nz-modal.type.ts index c971f03872f..ab6ffbeb57c 100644 --- a/components/modal/nz-modal.type.ts +++ b/components/modal/nz-modal.type.ts @@ -35,6 +35,8 @@ export interface ModalOptions { // tslint:disable-line:no-any nzOkText?: string; nzOkType?: string; nzOkLoading?: boolean; + nzOkDisabled?: boolean; + nzCancelDisabled?: boolean; nzOnOk?: EventEmitter | OnClickCallback; // Mixed using ng's Input/Output (Should care of "this" when using OnClickCallback) nzCancelText?: string; nzCancelLoading?: boolean;