feat(module:space): support standalone component (#8218)

Author: ParsaArvanehPA

components/space/doc/index.en-US.md

@@ -18,13 +18,12 @@ import { NzSpaceModule } from 'ng-zorro-antd/space';
 
 ## API
 
-### nz-space
-
-
-| Property | Description | Type | Default | Global Config |
-| --- | --- | --- | --- | --- |
-| `[nzSize]` | The space size | `'small' \| 'middle' \| 'large' \| number` | `small` | ✅ |
-| `[nzDirection]` | The space direction | `'vertical' \| 'horizontal'` | `horizontal` |  |
-| `[nzAlign]` | Align items | `'start' \| 'end' \| 'baseline' \| 'center'` | - | |
-| `[nzWrap]` | Auto wrap line, when `horizontal` effective| `boolean` | `false` | |
-| `[nzSplit]` | Set split | `TemplateRef` | - | |
+### nz-space:standalone
+
+| Property        | Description                                 | Type                                         | Default      | Global Config |
+| --------------- | ------------------------------------------- | -------------------------------------------- | ------------ | ------------- |
+| `[nzSize]`      | The space size                              | `'small' \| 'middle' \| 'large' \| number`   | `small`      | ✅            |
+| `[nzDirection]` | The space direction                         | `'vertical' \| 'horizontal'`                 | `horizontal` |               |
+| `[nzAlign]`     | Align items                                 | `'start' \| 'end' \| 'baseline' \| 'center'` | -            |               |
+| `[nzWrap]`      | Auto wrap line, when `horizontal` effective | `boolean`                                    | `false`      |               |
+| `[nzSplit]`     | Set split                                   | `TemplateRef`                                | -            |               |

components/space/doc/index.zh-CN.md

@@ -22,12 +22,12 @@ import { NzSpaceModule } from 'ng-zorro-antd/space';
 
 ## API
 
-### nz-space
-
-| 参数 | 说明 | 类型 | 默认值 | 支持全局配置 |
-| --------- | -------- | ------------------------------------------ | ------------ | -- |
-| `[nzSize]`      | 间距大小 | `'small' \| 'middle' \| 'large' \| number` | `'small'`  | ✅ |
-| `[nzDirection]` | 间距方向 | `'vertical' \| 'horizontal'` | `horizontal` | |
-| `[nzAlign]` | 对齐方式 | `'start' \| 'end' \| 'baseline' \| 'center'` | - | |
-| `[nzWrap]` | 是否自动换行，仅在 `horizontal` 时有效 | `boolean` | `false` | |
-| `[nzSplit]` | 设置分隔符 | `TemplateRef` | - | |
+### nz-space:standalone
+
+| 参数            | 说明                                   | 类型                                         | 默认值       | 支持全局配置 |
+| --------------- | -------------------------------------- | -------------------------------------------- | ------------ | ------------ |
+| `[nzSize]`      | 间距大小                               | `'small' \| 'middle' \| 'large' \| number`   | `'small'`    | ✅           |
+| `[nzDirection]` | 间距方向                               | `'vertical' \| 'horizontal'`                 | `horizontal` |              |
+| `[nzAlign]`     | 对齐方式                               | `'start' \| 'end' \| 'baseline' \| 'center'` | -            |              |
+| `[nzWrap]`      | 是否自动换行，仅在 `horizontal` 时有效 | `boolean`                                    | `false`      |              |
+| `[nzSplit]`     | 设置分隔符                             | `TemplateRef`                                | -            |              |

components/space/space-item.directive.ts

@@ -6,7 +6,8 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-  selector: '[nzSpaceItem]'
+  selector: '[nzSpaceItem]',
+  standalone: true
 })
 export class NzSpaceItemDirective {
   constructor() {}

components/space/space.component.ts

@@ -3,6 +3,7 @@
  * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  */
 
+import { NgForOf, NgIf, NgTemplateOutlet } from '@angular/common';
 import {
   AfterContentInit,
   ChangeDetectionStrategy,
@@ -67,7 +68,9 @@ const SPACE_SIZE: {
     '[class.ant-space-align-center]': 'mergedAlign === "center"',
     '[class.ant-space-align-baseline]': 'mergedAlign === "baseline"',
     '[style.flex-wrap]': 'nzWrap ? "wrap" : null'
-  }
+  },
+  imports: [NgTemplateOutlet, NgIf, NgForOf],
+  standalone: true
 })
 export class NzSpaceComponent implements OnChanges, OnDestroy, AfterContentInit {
   static ngAcceptInputType_nzWrap: BooleanInput;

components/space/space.module.ts

@@ -3,16 +3,13 @@
  * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  */
 
-import { BidiModule } from '@angular/cdk/bidi';
-import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
 import { NzSpaceItemDirective } from './space-item.directive';
 import { NzSpaceComponent } from './space.component';
 
 @NgModule({
-  declarations: [NzSpaceComponent, NzSpaceItemDirective],
-  exports: [NzSpaceComponent, NzSpaceItemDirective],
-  imports: [BidiModule, CommonModule]
+  imports: [NzSpaceComponent, NzSpaceItemDirective],
+  exports: [NzSpaceComponent, NzSpaceItemDirective]
 })
 export class NzSpaceModule {}