fix(theme:modal): removed nzComponentParams

package.json

@@ -81,7 +81,7 @@
     "extend": "^3.0.2",
     "file-saver": "^2.0.5",
     "ng-github-button": "^15.0.0",
-    "ng-zorro-antd": "^16.0.0",
+    "ng-zorro-antd": "^16.1.0",
     "ngx-color": "~9.0.0",
     "ngx-countdown": "^15.0.0",
     "ngx-highlight-js": "^15.0.0",

packages/theme/src/services/modal/index.en-US.md

@@ -54,4 +54,5 @@ Your body content
 | `exact` | Exact match return value, default is `true`, If the return value is not null (`null` or `undefined`) is considered successful, otherwise it is considered error. | `boolean` | `true` |
 | `includeTabs` | Whether to wrap the tab page | `boolean` | `false` |
 | `drag` | Drag | `boolean, ModalHelperDragOptions` | - |
+| `useNzData` | Whether it is mandatory to use `nzData` to pass parameters. If it is `false`, it means that the parameters will be directly mapped to the component instance, and other values ​​can only be obtained through `NZ_MODAL_DATA`. | `boolean` | `false` |
 | `modalOptions` | nz-modal raw parameters [ModalOptions](https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/modal/modal-types.ts) | `ModalOptions` | - |

packages/theme/src/services/modal/index.zh-CN.md

@@ -54,4 +54,5 @@ Your body content
 | `exact` | 是否精准（默认：`true`），若返回值非空值（`null`或`undefined`）视为成功，否则视为错误 | `boolean` | `true` |
 | `includeTabs` | 是否包裹标签页 | `boolean` | `false` |
 | `drag` | 支持拖动 | `boolean, ModalHelperDragOptions` | - |
+| `useNzData` | 是否强制使用 `nzData` 传递参数，若为 `false` 表示参数会直接映射到组件实例中，其他值只能通过 `NZ_MODAL_DATA` 的方式来获取参数 | `boolean` | `false` |
 | `modalOptions` | 对话框 [ModalOptions](https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/modal/modal-types.ts) 参数 | `ModalOptions` | - |

packages/theme/src/services/modal/modal.helper.ts

@@ -20,6 +20,10 @@ export interface ModalHelperOptions {
    * 是否支持拖动，默认是通过标题来触发
    */
   drag?: ModalHelperDragOptions | boolean;
+  /**
+   * 是否强制使用 `nzData` 传递参数，若为 `false` 表示参数会直接映射到组件实例中，其他值只能通过 `NZ_MODAL_DATA` 的方式来获取参数，默认：`false`
+   */
+  useNzData?: boolean;
 }
 
 export interface ModalHelperDragOptions {
@@ -86,7 +90,7 @@ export class ModalHelper {
       options
     );
     return new Observable((observer: Observer<NzSafeAny>) => {
-      const { size, includeTabs, modalOptions, drag } = options as ModalHelperOptions;
+      const { size, includeTabs, modalOptions, drag, useNzData } = options as ModalHelperOptions;
       let cls = '';
       let width = '';
       if (size) {
@@ -118,9 +122,13 @@ export class ModalHelper {
         nzContent: comp,
         nzWidth: width ? width : undefined,
         nzFooter: null,
-        nzComponentParams: params
+        nzData: params
       };
       const subject = this.srv.create({ ...defaultOptions, ...modalOptions });
+      // 保留 nzComponentParams 原有风格，但依然可以通过 @Inject(NZ_MODAL_DATA) 获取
+      if (useNzData !== true) {
+        Object.assign(subject.componentInstance, params);
+      }
       subject.afterOpen
         .pipe(
           take(1),

packages/theme/src/services/modal/modal.spec.ts

@@ -1,9 +1,9 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component, Inject, NgModule } from '@angular/core';
 import { ComponentFixture, fakeAsync, flush, TestBed, tick } from '@angular/core/testing';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 
-import { NzModalModule, NzModalRef } from 'ng-zorro-antd/modal';
+import { NZ_MODAL_DATA, NzModalModule, NzModalRef } from 'ng-zorro-antd/modal';
 
 import { AlainThemeModule } from '../../theme.module';
 import { ModalHelper } from './modal.helper';
@@ -49,6 +49,17 @@ describe('theme: ModalHelper', () => {
       fixture.detectChanges();
       expect(document.querySelector('.modal-include-tabs')).not.toBeNull();
     }));
+    it('should be useNzData is true', fakeAsync(() => {
+      modal.create(TestModalComponent, { ret: 'a' }, { useNzData: true }).subscribe(() => {
+        expect(true).toBeTruthy();
+        flush();
+      });
+      fixture.detectChanges();
+      tick(1000);
+      fixture.detectChanges();
+      expect(document.querySelector<HTMLElement>('.noNzData')?.innerText.trim()).toBe('true');
+      expect(document.querySelector<HTMLElement>('.nzData')?.innerText.trim()).toBe('a');
+    }));
     describe('#exact width true', () => {
       it('should be not trigger subscript when return a undefined value', fakeAsync(() => {
         modal.create(TestModalComponent, { ret: undefined }, { includeTabs: true, exact: true }).subscribe({
@@ -138,13 +149,16 @@ describe('theme: ModalHelper', () => {
 });
 
 @Component({
-  template: ` <div id="modal{{ id }}" class="handle">modal{{ id }}</div> `
+  template: `
+    <div id="modal{{ id }}" class="handle noNzData">{{ ret }}</div>
+    <div class="nzData">{{ data.ret }}</div>
+  `
 })
 class TestModalComponent {
   id = '';
   ret = 'true';
 
-  constructor(private modal: NzModalRef) {
+  constructor(private modal: NzModalRef, @Inject(NZ_MODAL_DATA) public data: { ret: string }) {
     setTimeout(() => {
       if (this.ret === 'destroy') {
         this.modal.destroy();