ng-zorro-antd-extension 17.4.2 → 17.4.4

package/fesm2022/ng-zorro-antd-extension-configurable-query.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Directive, Input, Component, InjectionToken, Injectable, Optional, Inject, ViewContainerRef, ViewChild, EventEmitter, ChangeDetectionStrategy, Output, ContentChildren, NgModule } from '@angular/core';
+import { Directive, Input, Component, ChangeDetectionStrategy, InjectionToken, Injectable, Optional, Inject, ViewContainerRef, ViewChild, EventEmitter, Output, ContentChildren, NgModule } from '@angular/core';
 import { updateControlStatus } from 'ng-zorro-antd-extension/util';
 import { BehaviorSubject, Subject, takeUntil, fromEvent } from 'rxjs';
 import * as i1$1 from 'ng-zorro-antd/i18n';
@@ -16,7 +16,11 @@ import * as i6 from 'ng-zorro-antd/button';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import * as i7 from 'ng-zorro-antd/core/transition-patch';
 import * as i8 from 'ng-zorro-antd/core/wave';
-import * as i9 from 'ng-zorro-antd/icon';
+import * as i9 from 'ng-zorro-antd/card';
+import { NzCardModule } from 'ng-zorro-antd/card';
+import * as i10 from 'ng-zorro-antd/space';
+import { NzSpaceModule } from 'ng-zorro-antd/space';
+import * as i11 from 'ng-zorro-antd/icon';
 import { NzIconModule } from 'ng-zorro-antd/icon';
 import * as i3 from 'ng-zorro-antd/date-picker';
 import { NzDatePickerModule } from 'ng-zorro-antd/date-picker';
@@ -45,6 +49,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
  * 用来动态添加control type类型控件，类型控件需要继承此控件
  */
 class NzxAbstractControl {
+    get formControl() {
+        return this.form.get(this.control.controlName);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxAbstractControl, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: NzxAbstractControl, inputs: { form: "form", control: "control" }, ngImport: i0 }); }
 }
@@ -62,12 +69,12 @@ class NzxDatePickerControlComponent extends NzxAbstractControl {
     <ng-container [formGroup]="form">
       <nz-date-picker
         [ngStyle]="{ width: '100%' }"
-        [formControlName]="control.controlName!"
+        [formControl]="formControl"
         [nzPlaceHolder]="control.placeholder!"
       >
       </nz-date-picker>
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.NzDatePickerComponent, selector: "nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker", inputs: ["nzAllowClear", "nzAutoFocus", "nzDisabled", "nzBorderless", "nzInputReadOnly", "nzInline", "nzOpen", "nzDisabledDate", "nzLocale", "nzPlaceHolder", "nzPopupStyle", "nzDropdownClassName", "nzSize", "nzStatus", "nzFormat", "nzDateRender", "nzDisabledTime", "nzRenderExtraFooter", "nzShowToday", "nzMode", "nzShowNow", "nzRanges", "nzDefaultPickerValue", "nzSeparator", "nzSuffixIcon", "nzBackdrop", "nzId", "nzPlacement", "nzShowWeekNumber", "nzShowTime"], outputs: ["nzOnPanelChange", "nzOnCalendarChange", "nzOnOk", "nzOnOpenChange"], exportAs: ["nzDatePicker"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.NzDatePickerComponent, selector: "nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker", inputs: ["nzAllowClear", "nzAutoFocus", "nzDisabled", "nzBorderless", "nzInputReadOnly", "nzInline", "nzOpen", "nzDisabledDate", "nzLocale", "nzPlaceHolder", "nzPopupStyle", "nzDropdownClassName", "nzSize", "nzStatus", "nzFormat", "nzDateRender", "nzDisabledTime", "nzRenderExtraFooter", "nzShowToday", "nzMode", "nzShowNow", "nzRanges", "nzDefaultPickerValue", "nzSeparator", "nzSuffixIcon", "nzBackdrop", "nzId", "nzPlacement", "nzShowWeekNumber", "nzShowTime"], outputs: ["nzOnPanelChange", "nzOnCalendarChange", "nzOnOk", "nzOnOpenChange"], exportAs: ["nzDatePicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxDatePickerControlComponent, decorators: [{
             type: Component,
@@ -76,12 +83,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
     <ng-container [formGroup]="form">
       <nz-date-picker
         [ngStyle]="{ width: '100%' }"
-        [formControlName]="control.controlName!"
+        [formControl]="formControl"
         [nzPlaceHolder]="control.placeholder!"
       >
       </nz-date-picker>
     </ng-container>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
@@ -90,13 +98,13 @@ class NzxInputControlComponent extends NzxAbstractControl {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NzxInputControlComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
     <ng-container [formGroup]="form">
       <input
+        [formControl]="formControl"
         nz-input
         type="text"
         [placeholder]="control.placeholder"
-        [formControlName]="control.controlName!"
       />
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.NzInputDirective, selector: "input[nz-input],textarea[nz-input]", inputs: ["nzBorderless", "nzSize", "nzStepperless", "nzStatus", "disabled"], exportAs: ["nzInput"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.NzInputDirective, selector: "input[nz-input],textarea[nz-input]", inputs: ["nzBorderless", "nzSize", "nzStepperless", "nzStatus", "disabled"], exportAs: ["nzInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxInputControlComponent, decorators: [{
             type: Component,
@@ -104,13 +112,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                     template: `
     <ng-container [formGroup]="form">
       <input
+        [formControl]="formControl"
         nz-input
         type="text"
         [placeholder]="control.placeholder"
-        [formControlName]="control.controlName!"
       />
     </ng-container>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
@@ -119,12 +128,12 @@ class NzxRangePickerControlComponent extends NzxAbstractControl {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NzxRangePickerControlComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
     <ng-container [formGroup]="form">
       <nz-range-picker
+        [formControl]="formControl"
         [ngStyle]="{ width: '100%' }"
-        [formControlName]="control.controlName!"
       >
       </nz-range-picker>
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.NzDatePickerComponent, selector: "nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker", inputs: ["nzAllowClear", "nzAutoFocus", "nzDisabled", "nzBorderless", "nzInputReadOnly", "nzInline", "nzOpen", "nzDisabledDate", "nzLocale", "nzPlaceHolder", "nzPopupStyle", "nzDropdownClassName", "nzSize", "nzStatus", "nzFormat", "nzDateRender", "nzDisabledTime", "nzRenderExtraFooter", "nzShowToday", "nzMode", "nzShowNow", "nzRanges", "nzDefaultPickerValue", "nzSeparator", "nzSuffixIcon", "nzBackdrop", "nzId", "nzPlacement", "nzShowWeekNumber", "nzShowTime"], outputs: ["nzOnPanelChange", "nzOnCalendarChange", "nzOnOk", "nzOnOpenChange"], exportAs: ["nzDatePicker"] }, { kind: "directive", type: i3.NzRangePickerComponent, selector: "nz-range-picker", exportAs: ["nzRangePicker"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.NzDatePickerComponent, selector: "nz-date-picker,nz-week-picker,nz-month-picker,nz-year-picker,nz-range-picker", inputs: ["nzAllowClear", "nzAutoFocus", "nzDisabled", "nzBorderless", "nzInputReadOnly", "nzInline", "nzOpen", "nzDisabledDate", "nzLocale", "nzPlaceHolder", "nzPopupStyle", "nzDropdownClassName", "nzSize", "nzStatus", "nzFormat", "nzDateRender", "nzDisabledTime", "nzRenderExtraFooter", "nzShowToday", "nzMode", "nzShowNow", "nzRanges", "nzDefaultPickerValue", "nzSeparator", "nzSuffixIcon", "nzBackdrop", "nzId", "nzPlacement", "nzShowWeekNumber", "nzShowTime"], outputs: ["nzOnPanelChange", "nzOnCalendarChange", "nzOnOk", "nzOnOpenChange"], exportAs: ["nzDatePicker"] }, { kind: "directive", type: i3.NzRangePickerComponent, selector: "nz-range-picker", exportAs: ["nzRangePicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxRangePickerControlComponent, decorators: [{
             type: Component,
@@ -132,12 +141,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                     template: `
     <ng-container [formGroup]="form">
       <nz-range-picker
+        [formControl]="formControl"
         [ngStyle]="{ width: '100%' }"
-        [formControlName]="control.controlName!"
       >
       </nz-range-picker>
     </ng-container>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
@@ -146,7 +156,7 @@ class NzxSelectControlComponent extends NzxAbstractControl {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NzxSelectControlComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
     <ng-container [formGroup]="form">
       <nz-select
-        [formControlName]="control.controlName!"
+        [formControl]="formControl"
         [nzShowSearch]="control.nzxShowSearch ?? true"
         [nzAllowClear]="control.nzxAllowClear ?? true"
         [nzPlaceHolder]="control.placeholder!"
@@ -159,7 +169,7 @@ class NzxSelectControlComponent extends NzxAbstractControl {
         </nz-option>
       </nz-select>
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$1.NzOptionComponent, selector: "nz-option", inputs: ["nzTitle", "nzLabel", "nzValue", "nzKey", "nzDisabled", "nzHide", "nzCustomContent"], exportAs: ["nzOption"] }, { kind: "component", type: i3$1.NzSelectComponent, selector: "nz-select", inputs: ["nzId", "nzSize", "nzStatus", "nzOptionHeightPx", "nzOptionOverflowSize", "nzDropdownClassName", "nzDropdownMatchSelectWidth", "nzDropdownStyle", "nzNotFoundContent", "nzPlaceHolder", "nzPlacement", "nzMaxTagCount", "nzDropdownRender", "nzCustomTemplate", "nzSuffixIcon", "nzClearIcon", "nzRemoveIcon", "nzMenuItemSelectedIcon", "nzTokenSeparators", "nzMaxTagPlaceholder", "nzMaxMultipleCount", "nzMode", "nzFilterOption", "compareWith", "nzAllowClear", "nzBorderless", "nzShowSearch", "nzLoading", "nzAutoFocus", "nzAutoClearSearchValue", "nzServerSearch", "nzDisabled", "nzOpen", "nzSelectOnTab", "nzBackdrop", "nzOptions", "nzShowArrow"], outputs: ["nzOnSearch", "nzScrollToBottom", "nzOpenChange", "nzBlur", "nzFocus"], exportAs: ["nzSelect"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3$1.NzOptionComponent, selector: "nz-option", inputs: ["nzTitle", "nzLabel", "nzValue", "nzKey", "nzDisabled", "nzHide", "nzCustomContent"], exportAs: ["nzOption"] }, { kind: "component", type: i3$1.NzSelectComponent, selector: "nz-select", inputs: ["nzId", "nzSize", "nzStatus", "nzOptionHeightPx", "nzOptionOverflowSize", "nzDropdownClassName", "nzDropdownMatchSelectWidth", "nzDropdownStyle", "nzNotFoundContent", "nzPlaceHolder", "nzPlacement", "nzMaxTagCount", "nzDropdownRender", "nzCustomTemplate", "nzSuffixIcon", "nzClearIcon", "nzRemoveIcon", "nzMenuItemSelectedIcon", "nzTokenSeparators", "nzMaxTagPlaceholder", "nzMaxMultipleCount", "nzMode", "nzFilterOption", "compareWith", "nzAllowClear", "nzBorderless", "nzShowSearch", "nzLoading", "nzAutoFocus", "nzAutoClearSearchValue", "nzServerSearch", "nzDisabled", "nzOpen", "nzSelectOnTab", "nzBackdrop", "nzOptions", "nzShowArrow"], outputs: ["nzOnSearch", "nzScrollToBottom", "nzOpenChange", "nzBlur", "nzFocus"], exportAs: ["nzSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxSelectControlComponent, decorators: [{
             type: Component,
@@ -167,7 +177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                     template: `
     <ng-container [formGroup]="form">
       <nz-select
-        [formControlName]="control.controlName!"
+        [formControl]="formControl"
         [nzShowSearch]="control.nzxShowSearch ?? true"
         [nzAllowClear]="control.nzxAllowClear ?? true"
         [nzPlaceHolder]="control.placeholder!"
@@ -181,6 +191,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
       </nz-select>
     </ng-container>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
@@ -190,11 +201,11 @@ class NzxTemplateControlComponent extends NzxAbstractControl {
     <ng-container
       *ngTemplateOutlet="
         control.templateRef!;
-        context: { $implicit: form.get(control.controlName!), formGroup: form }
+        context: { $implicit: formControl, formGroup: form }
       "
     >
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxTemplateControlComponent, decorators: [{
             type: Component,
@@ -203,11 +214,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
     <ng-container
       *ngTemplateOutlet="
         control.templateRef!;
-        context: { $implicit: form.get(control.controlName!), formGroup: form }
+        context: { $implicit: formControl, formGroup: form }
       "
     >
     </ng-container>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }] });
 
@@ -235,6 +247,7 @@ class NzxQueryConfigService {
             }
         }
     }
+    /** 添加controlType 类型控件 */
     addControlType(controlType) {
         const find = this.controlTypePoll.some((i) => i.key === controlType.key);
         if (find) {
@@ -242,6 +255,7 @@ class NzxQueryConfigService {
         }
         this.controlTypePoll.push(controlType);
     }
+    /** 删除controlType 类型控件 */
     removeControlType(key) {
         const find = this.controlTypePoll.some((i) => i.key === key);
         if (find) {
@@ -251,6 +265,7 @@ class NzxQueryConfigService {
             throw `ControlType:: ${key} not exists !`;
         }
     }
+    /** 刷新 */
     refreshControlType() {
         this.controlTypes$.next(this.controlTypePoll);
     }
@@ -313,7 +328,7 @@ class NzxConfigurableQueryItemComponent {
         <ng-template #controlTemp></ng-template>
       </nz-form-control>
     </nz-form-item>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i3$2.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "component", type: i4.NzFormItemComponent, selector: "nz-form-item", exportAs: ["nzFormItem"] }, { kind: "component", type: i4.NzFormLabelComponent, selector: "nz-form-label", inputs: ["nzFor", "nzRequired", "nzNoColon", "nzTooltipTitle", "nzTooltipIcon", "nzLabelAlign", "nzLabelWrap"], exportAs: ["nzFormLabel"] }, { kind: "component", type: i4.NzFormControlComponent, selector: "nz-form-control", inputs: ["nzSuccessTip", "nzWarningTip", "nzErrorTip", "nzValidatingTip", "nzExtra", "nzAutoTips", "nzDisableAutoTips", "nzHasFeedback", "nzValidateStatus"], exportAs: ["nzFormControl"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i3$2.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "component", type: i4.NzFormItemComponent, selector: "nz-form-item", exportAs: ["nzFormItem"] }, { kind: "component", type: i4.NzFormLabelComponent, selector: "nz-form-label", inputs: ["nzFor", "nzRequired", "nzNoColon", "nzTooltipTitle", "nzTooltipIcon", "nzLabelAlign", "nzLabelWrap"], exportAs: ["nzFormLabel"] }, { kind: "component", type: i4.NzFormControlComponent, selector: "nz-form-control", inputs: ["nzSuccessTip", "nzWarningTip", "nzErrorTip", "nzValidatingTip", "nzExtra", "nzAutoTips", "nzDisableAutoTips", "nzHasFeedback", "nzValidateStatus"], exportAs: ["nzFormControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxConfigurableQueryItemComponent, decorators: [{
             type: Component,
@@ -335,6 +350,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
       </nz-form-control>
     </nz-form-item>
   `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
         }], ctorParameters: () => [{ type: NzxQueryConfigService }], propDecorators: { form: [{
                 type: Input
@@ -350,13 +366,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
  * 支持模板自定义，在使用模板自定义时，要注意controlType应该设置为Template并且确保controlName与指令上的nzxControl应该相同
  */
 class NzxConfigurableQueryComponent {
-    /** 查询组件出参*/
+    /** 组件最终的查询参数 */
     get queryParams() {
         return this._queryParams;
     }
     set queryParams(value) {
         this._queryParams = value;
     }
+    /** 判断当前组件是否展示展开折叠按钮 */
     get nzxCollapse() {
         return this.controls.some((i) => i.hasOwnProperty('collapse'));
     }
@@ -364,19 +381,21 @@ class NzxConfigurableQueryComponent {
         this.i18n = i18n;
         this.fb = fb;
         this.cd = cd;
-        /** 配置项 */
+        /**
+         * 配置项用来生成查询表单
+         */
         this.controls = [];
-        /** 查询表单排列方式 */
+        /** 查询表单排列方式默认start */
         this.nzxJustify = 'start';
-        /** 查询项间隔 */
+        /** 查询项间隔默认为8 */
         this.nzxGutter = 8;
-        /** 一行展示多少查询项 */
+        /** 一行展示多少查询项默认展示3个 */
         this.lineNumber = 3;
         /** 操作按钮所占栅格数，24则换行 */
         this.nzxBtnSpan = null;
-        /** 初始化时，主动查询 */
+        /** 初始化时，是否主动触发查询 */
         this.initQuery = false;
-        /** 缺省 固定参数 */
+        /** 缺省 固定参数会固定携带在抛出事件中 */
         this.fixedParams = {};
         /** 查询时会触发抛出查询参数 */
         this.queryChange = new EventEmitter();
@@ -544,6 +563,7 @@ class NzxConfigurableQueryComponent {
         this.destroy$.next();
         this.destroy$.complete();
     }
+    /** 计算展开收起icon、文案 */
     calculateText() {
         if (this.controls.some((i) => i.collapse === true)) {
             this.collapseIcon = 'down';
@@ -602,11 +622,11 @@ class NzxConfigurableQueryComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxConfigurableQueryComponent, deps: [{ token: i1$1.NzI18nService }, { token: i2.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NzxConfigurableQueryComponent, selector: "nzx-configurable-query", inputs: { controls: "controls", nzxJustify: "nzxJustify", nzxGutter: "nzxGutter", lineNumber: "lineNumber", nzxBtnSpan: "nzxBtnSpan", initQuery: "initQuery", fixedParams: "fixedParams" }, outputs: { queryChange: "queryChange", resetChange: "resetChange" }, queries: [{ propertyName: "controlTemplateList", predicate: NzxControlDirective, descendants: true }], viewQueries: [{ propertyName: "queyFormEl", first: true, predicate: ["queyForm"], descendants: true }], exportAs: ["NzxConfigurableQuery"], usesOnChanges: true, ngImport: i0, template: "<form #queyForm class=\"nzx-query-container\" nz-form [formGroup]=\"queryForm\">\n  <div nz-row [nzGutter]=\"nzxGutter\" [nzJustify]=\"nzxJustify\">\n    <ng-container *ngFor=\"let config of controls; let i = index\">\n      <div\n        *ngIf=\"!config.hidden\"\n        nz-col\n        [nzSpan]=\"config.nzxSpan || 24 / lineNumber\"\n        [hidden]=\"config.collapse\"\n        [nzOrder]=\"i\"\n      >\n        <nzx-configurable-query-item\n          *ngIf=\"config.controlName\"\n          [form]=\"queryForm\"\n          [control]=\"config\"\n        ></nzx-configurable-query-item>\n      </div>\n    </ng-container>\n\n    <div\n      [nzOrder]=\"controls.length\"\n      class=\"nzx-query-btn\"\n      nz-col\n      [nzSpan]=\"nzxBtnSpan || 24 / lineNumber\"\n    >\n      <div nz-row nzJustify=\"end\" nzAlign=\"middle\">\n        <button\n          nz-button\n          nzType=\"primary\"\n          type=\"button\"\n          title=\"Enter\"\n          (click)=\"search()\"\n        >\n          {{ locale['query'] }}\n        </button>\n        <button nz-button type=\"button\" title=\"ctrl+r\" (click)=\"reset()\">\n          {{ locale['reset'] }}\n        </button>\n        <ng-content></ng-content>\n        <a\n          *ngIf=\"nzxCollapse\"\n          nz-button\n          nzType=\"link\"\n          (click)=\"toggleCollapse()\"\n        >\n          {{ collapseText }}\n          <i nz-icon [nzType]=\"collapseIcon\"></i>\n        </a>\n      </div>\n    </div>\n  </div>\n</form>\n", styles: [".nzx-query-container{padding:12px;background-color:#fff;border-radius:8px}.nzx-query-container [nz-form-label]{overflow:visible}.nzx-query-container .nzx-query-btn{flex-grow:2;max-width:none}.nzx-query-container .nzx-query-btn button{margin:0 4px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i3$2.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "directive", type: i4.NzFormDirective, selector: "[nz-form]", inputs: ["nzLayout", "nzNoColon", "nzAutoTips", "nzDisableAutoTips", "nzTooltipIcon", "nzLabelAlign", "nzLabelWrap"], exportAs: ["nzForm"] }, { kind: "component", type: i6.NzButtonComponent, selector: "button[nz-button], a[nz-button]", inputs: ["nzBlock", "nzGhost", "nzSearch", "nzLoading", "nzDanger", "disabled", "tabIndex", "nzType", "nzShape", "nzSize"], exportAs: ["nzButton"] }, { kind: "directive", type: i7.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "directive", type: i8.NzWaveDirective, selector: "[nz-wave],button[nz-button]:not([nzType=\"link\"]):not([nzType=\"text\"])", inputs: ["nzWaveExtraNode"], exportAs: ["nzWave"] }, { kind: "directive", type: i9.NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzxConfigurableQueryItemComponent, selector: "nzx-configurable-query-item", inputs: ["form", "control"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NzxConfigurableQueryComponent, selector: "nzx-configurable-query", inputs: { controls: "controls", nzxJustify: "nzxJustify", nzxGutter: "nzxGutter", lineNumber: "lineNumber", nzxBtnSpan: "nzxBtnSpan", initQuery: "initQuery", fixedParams: "fixedParams" }, outputs: { queryChange: "queryChange", resetChange: "resetChange" }, queries: [{ propertyName: "controlTemplateList", predicate: NzxControlDirective, descendants: true }], viewQueries: [{ propertyName: "queyFormEl", first: true, predicate: ["queyForm"], descendants: true }], exportAs: ["NzxConfigurableQuery"], usesOnChanges: true, ngImport: i0, template: "<nz-card>\n  <form #queyForm class=\"nzx-query-container\" nz-form [formGroup]=\"queryForm\">\n    <div nz-row [nzGutter]=\"nzxGutter\" [nzJustify]=\"nzxJustify\">\n      <ng-container *ngFor=\"let config of controls; let i = index\">\n        <div\n          *ngIf=\"!config.hidden\"\n          nz-col\n          [nzSpan]=\"config.nzxSpan || 24 / lineNumber\"\n          [hidden]=\"config.collapse\"\n          [nzOrder]=\"i\"\n        >\n          <nzx-configurable-query-item\n            *ngIf=\"config.controlName\"\n            [form]=\"queryForm\"\n            [control]=\"config\"\n          ></nzx-configurable-query-item>\n        </div>\n      </ng-container>\n\n      <div\n        class=\"nzx-query-btn\"\n        nz-col\n        [nzOrder]=\"controls.length\"\n        [nzSpan]=\"nzxBtnSpan || 24 / lineNumber\"\n      >\n        <div nz-row nzJustify=\"end\" nzAlign=\"middle\">\n          <nz-space>\n            <button\n              *nzSpaceItem\n              nz-button\n              nzType=\"primary\"\n              type=\"button\"\n              title=\"Enter\"\n              (click)=\"search()\"\n            >\n              {{ locale['query'] }}\n            </button>\n            <button\n              *nzSpaceItem\n              nz-button\n              type=\"button\"\n              title=\"ctrl+r\"\n              (click)=\"reset()\"\n            >\n              {{ locale['reset'] }}\n            </button>\n            <ng-container *nzSpaceItem>\n              <ng-content></ng-content>\n            </ng-container>\n            <ng-container *ngIf=\"nzxCollapse\">\n              <a\n                *nzSpaceItem\n                nz-button\n                nzType=\"link\"\n                (click)=\"toggleCollapse()\"\n              >\n                {{ collapseText }}\n                <i nz-icon [nzType]=\"collapseIcon\"></i>\n              </a>\n            </ng-container>\n          </nz-space>\n        </div>\n      </div>\n    </div>\n  </form>\n</nz-card>\n", styles: [".nzx-query-container [nz-form-label]{overflow:visible}.nzx-query-container .nzx-query-btn{flex-grow:2;max-width:none}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i3$2.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "directive", type: i4.NzFormDirective, selector: "[nz-form]", inputs: ["nzLayout", "nzNoColon", "nzAutoTips", "nzDisableAutoTips", "nzTooltipIcon", "nzLabelAlign", "nzLabelWrap"], exportAs: ["nzForm"] }, { kind: "component", type: i6.NzButtonComponent, selector: "button[nz-button], a[nz-button]", inputs: ["nzBlock", "nzGhost", "nzSearch", "nzLoading", "nzDanger", "disabled", "tabIndex", "nzType", "nzShape", "nzSize"], exportAs: ["nzButton"] }, { kind: "directive", type: i7.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "directive", type: i8.NzWaveDirective, selector: "[nz-wave],button[nz-button]:not([nzType=\"link\"]):not([nzType=\"text\"])", inputs: ["nzWaveExtraNode"], exportAs: ["nzWave"] }, { kind: "component", type: i9.NzCardComponent, selector: "nz-card", inputs: ["nzBordered", "nzBorderless", "nzLoading", "nzHoverable", "nzBodyStyle", "nzCover", "nzActions", "nzType", "nzSize", "nzTitle", "nzExtra"], exportAs: ["nzCard"] }, { kind: "component", type: i10.NzSpaceComponent, selector: "nz-space, [nz-space]", inputs: ["nzDirection", "nzAlign", "nzSplit", "nzWrap", "nzSize"], exportAs: ["NzSpace"] }, { kind: "directive", type: i10.NzSpaceItemDirective, selector: "[nzSpaceItem]" }, { kind: "directive", type: i11.NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzxConfigurableQueryItemComponent, selector: "nzx-configurable-query-item", inputs: ["form", "control"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxConfigurableQueryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'nzx-configurable-query', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'NzxConfigurableQuery', template: "<form #queyForm class=\"nzx-query-container\" nz-form [formGroup]=\"queryForm\">\n  <div nz-row [nzGutter]=\"nzxGutter\" [nzJustify]=\"nzxJustify\">\n    <ng-container *ngFor=\"let config of controls; let i = index\">\n      <div\n        *ngIf=\"!config.hidden\"\n        nz-col\n        [nzSpan]=\"config.nzxSpan || 24 / lineNumber\"\n        [hidden]=\"config.collapse\"\n        [nzOrder]=\"i\"\n      >\n        <nzx-configurable-query-item\n          *ngIf=\"config.controlName\"\n          [form]=\"queryForm\"\n          [control]=\"config\"\n        ></nzx-configurable-query-item>\n      </div>\n    </ng-container>\n\n    <div\n      [nzOrder]=\"controls.length\"\n      class=\"nzx-query-btn\"\n      nz-col\n      [nzSpan]=\"nzxBtnSpan || 24 / lineNumber\"\n    >\n      <div nz-row nzJustify=\"end\" nzAlign=\"middle\">\n        <button\n          nz-button\n          nzType=\"primary\"\n          type=\"button\"\n          title=\"Enter\"\n          (click)=\"search()\"\n        >\n          {{ locale['query'] }}\n        </button>\n        <button nz-button type=\"button\" title=\"ctrl+r\" (click)=\"reset()\">\n          {{ locale['reset'] }}\n        </button>\n        <ng-content></ng-content>\n        <a\n          *ngIf=\"nzxCollapse\"\n          nz-button\n          nzType=\"link\"\n          (click)=\"toggleCollapse()\"\n        >\n          {{ collapseText }}\n          <i nz-icon [nzType]=\"collapseIcon\"></i>\n        </a>\n      </div>\n    </div>\n  </div>\n</form>\n", styles: [".nzx-query-container{padding:12px;background-color:#fff;border-radius:8px}.nzx-query-container [nz-form-label]{overflow:visible}.nzx-query-container .nzx-query-btn{flex-grow:2;max-width:none}.nzx-query-container .nzx-query-btn button{margin:0 4px}\n"] }]
+            args: [{ selector: 'nzx-configurable-query', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'NzxConfigurableQuery', template: "<nz-card>\n  <form #queyForm class=\"nzx-query-container\" nz-form [formGroup]=\"queryForm\">\n    <div nz-row [nzGutter]=\"nzxGutter\" [nzJustify]=\"nzxJustify\">\n      <ng-container *ngFor=\"let config of controls; let i = index\">\n        <div\n          *ngIf=\"!config.hidden\"\n          nz-col\n          [nzSpan]=\"config.nzxSpan || 24 / lineNumber\"\n          [hidden]=\"config.collapse\"\n          [nzOrder]=\"i\"\n        >\n          <nzx-configurable-query-item\n            *ngIf=\"config.controlName\"\n            [form]=\"queryForm\"\n            [control]=\"config\"\n          ></nzx-configurable-query-item>\n        </div>\n      </ng-container>\n\n      <div\n        class=\"nzx-query-btn\"\n        nz-col\n        [nzOrder]=\"controls.length\"\n        [nzSpan]=\"nzxBtnSpan || 24 / lineNumber\"\n      >\n        <div nz-row nzJustify=\"end\" nzAlign=\"middle\">\n          <nz-space>\n            <button\n              *nzSpaceItem\n              nz-button\n              nzType=\"primary\"\n              type=\"button\"\n              title=\"Enter\"\n              (click)=\"search()\"\n            >\n              {{ locale['query'] }}\n            </button>\n            <button\n              *nzSpaceItem\n              nz-button\n              type=\"button\"\n              title=\"ctrl+r\"\n              (click)=\"reset()\"\n            >\n              {{ locale['reset'] }}\n            </button>\n            <ng-container *nzSpaceItem>\n              <ng-content></ng-content>\n            </ng-container>\n            <ng-container *ngIf=\"nzxCollapse\">\n              <a\n                *nzSpaceItem\n                nz-button\n                nzType=\"link\"\n                (click)=\"toggleCollapse()\"\n              >\n                {{ collapseText }}\n                <i nz-icon [nzType]=\"collapseIcon\"></i>\n              </a>\n            </ng-container>\n          </nz-space>\n        </div>\n      </div>\n    </div>\n  </form>\n</nz-card>\n", styles: [".nzx-query-container [nz-form-label]{overflow:visible}.nzx-query-container .nzx-query-btn{flex-grow:2;max-width:none}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.NzI18nService }, { type: i2.FormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { controls: [{
                 type: Input
             }], nzxJustify: [{
@@ -673,6 +693,8 @@ class NzxConfigurableQueryModule {
             NzButtonModule,
             NzSelectModule,
             NzDatePickerModule,
+            NzCardModule,
+            NzSpaceModule,
             NzIconModule,
             NzI18nModule], exports: [NzxControlDirective, NzxConfigurableQueryComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NzxConfigurableQueryModule, imports: [CommonModule,
@@ -683,6 +705,8 @@ class NzxConfigurableQueryModule {
             NzButtonModule,
             NzSelectModule,
             NzDatePickerModule,
+            NzCardModule,
+            NzSpaceModule,
             NzIconModule,
             NzI18nModule] }); }
 }
@@ -708,6 +732,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         NzButtonModule,
                         NzSelectModule,
                         NzDatePickerModule,
+                        NzCardModule,
+                        NzSpaceModule,
                         NzIconModule,
                         NzI18nModule,
                     ],