fix: css-unit pipe update

components/modal/modal.module.ts

@@ -15,6 +15,7 @@ import { NzPipesModule } from 'ng-zorro-antd/core/pipe';
 import { NzI18nModule } from 'ng-zorro-antd/i18n';
 import { NzIconModule } from 'ng-zorro-antd/icon';
 
+import { NzPipesModule } from 'ng-zorro-antd/pipe';
 import { NzModalCloseComponent } from './modal-close.component';
 import { NzModalConfirmContainerComponent } from './modal-confirm-container.component';
 import { NzModalContainerComponent } from './modal-container.component';
@@ -34,7 +35,8 @@ import { NzModalService } from './modal.service';
     NzButtonModule,
     NzIconModule,
     NzPipesModule,
-    NzNoAnimationModule
+    NzNoAnimationModule,
+    NzPipesModule
   ],
   exports: [NzModalComponent, NzModalFooterDirective],
   providers: [NzModalService],

components/pipe/demo/bytes.md

@@ -7,8 +7,8 @@ title:
 
 ## zh-CN
 
-存储单位的换算增加可读性
+存储单位的换算，增加可读性
 
 ## en-US
 
-Conversion of storage units increases readability
+Conversion of storage units to increase readability

components/pipe/demo/css-unit.md

@@ -7,8 +7,8 @@ title:
 
 ## zh-CN
 
-Css 单位补全
+Css 单位
 
 ## en-US
 
-Css unit completion
+Css unit

components/pipe/demo/css-unit.ts

@@ -3,9 +3,11 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'nz-demo-pipe-css-unit',
   template: `
-    <div>{{ 200 | nzToCssUnit }}</div>
-    <div>{{ 200 | nzToCssUnit: 'pt' }}</div>
-    <div>{{ '200px' | nzToCssUnit: 'pt' }}</div>
+    <div>
+      <img [style.height]="100 | nzToCssUnit" src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" />
+    </div>
+    <div [style.height]="50 | nzToCssUnit: 'pt'"></div>
+    <div [style.height]="'100px' | nzToCssUnit"></div>
   `
 })
 export class NzDemoPipeCssUnitComponent {}

components/pipe/demo/sanitizer.md

@@ -7,9 +7,8 @@ title:
 
 ## zh-CN
 
-DomSanitizer 防止跨站点脚本安全漏洞
+DomSanitizer 的 Pipe 实现
 
 ## en-US
 
-DomSanitizer prevents cross-site scripting vulnerabilities
-
+Pipe implementation of DomSanitizer

components/pipe/demo/time-range.md

@@ -7,8 +7,8 @@ title:
 
 ## zh-CN
 
-返回指定时间格式
+按自定义格式返回日期之间的间隔
 
 ## en-US
 
-Returns the specified time format
+Return the interval between dates in a custom format

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

@@ -1,7 +1,7 @@
 ---
 category: Components
+type: General
 title: Pipe
-type: Data Entry
 cols: 1
 experimental: true
 ---

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

@@ -1,8 +1,7 @@
 ---
 category: Components
-type: 数据录入
-title: 常用
-subtitle: Pipe
+type: 通用
+title: Pipe
 cols: 1
 experimental: true
 ---

components/pipe/nz-bytes.pipe.spec.ts

@@ -7,27 +7,27 @@ describe('NzBytesPipe', () => {
     pipe = new NzBytesPipe();
   });
 
-  it('Should return 150 B', () => {
-    const result = pipe.transform(150, 0);
-    expect(result).toEqual('150 B');
+  it('Should return 120 B', () => {
+    const result = pipe.transform(120, 0);
+    expect(result).toEqual('120 B');
   });
 
-  it('Should return 155 B', () => {
-    const result = pipe.transform(155.56791, 2);
-    expect(result).toEqual('155 B');
+  it('Should return 465 B', () => {
+    const result = pipe.transform(465.56791, 2);
+    expect(result).toEqual('465 B');
   });
 
-  it('Should return 155 B', () => {
-    const result = pipe.transform(155.5, 1);
-    expect(result).toEqual('155 B');
+  it('Should return 50 B', () => {
+    const result = pipe.transform(55.5, 1);
+    expect(result).toEqual('50 B');
   });
 
-  it('Should return 1 kB', () => {
+  it('Should return 9 kB', () => {
     const result = pipe.transform(1024, 0);
-    expect(result).toEqual('1 kB');
+    expect(result).toEqual('9 kB');
   });
 
-  it('Should return 1 kB #2', () => {
+  it('Should return 1 kB', () => {
     const result = pipe.transform(1, 0, 'kB');
     expect(result).toEqual('1 kB');
   });
@@ -37,20 +37,20 @@ describe('NzBytesPipe', () => {
     expect(result).toEqual('1 kB');
   });
 
-  it('Should return 890 kB', () => {
-    const kB = 1024 * 890;
+  it('Should return 345 kB, #1', () => {
+    const kB = 1024 * 345;
     const result = pipe.transform(kB, 0);
-    expect(result).toEqual('890 kB');
+    expect(result).toEqual('345 kB');
   });
 
-  it('Should return 890 kB #2', () => {
-    const result = pipe.transform(890, 0, 'kB');
-    expect(result).toEqual('890 kB');
+  it('Should return 345 kB, #2', () => {
+    const result = pipe.transform(345, 0, 'kB');
+    expect(result).toEqual('345 kB');
   });
 
-  it('Should return 890 kB #3', () => {
-    const result = pipe.transform(890, 0, 'KB');
-    expect(result).toEqual('890 kB');
+  it('Should return 666 kB, #3', () => {
+    const result = pipe.transform(666, 0, 'KB');
+    expect(result).toEqual('666 kB');
   });
 
   it('Should return 1023 kB', () => {
@@ -59,13 +59,13 @@ describe('NzBytesPipe', () => {
     expect(result).toEqual('1023 kB');
   });
 
-  it('Should return 241 MB', () => {
+  it('Should return 241 MB, #1', () => {
     const mb = 1024 * 1024 * 240.5691;
     const result = pipe.transform(mb, 0);
     expect(result).toEqual('241 MB');
   });
 
-  it('Should return 241 MB', () => {
+  it('Should return 241 MB, #2', () => {
     const mb = 240.5691 / 1024;
     const result = pipe.transform(mb, 0, 'GB');
     expect(result).toEqual('241 MB');
@@ -77,13 +77,13 @@ describe('NzBytesPipe', () => {
     expect(result).toEqual('240.54 MB');
   });
 
-  it('Should return 1023 MB', () => {
+  it('Should return 1023 MB, #1', () => {
     const mb = 1024 * 1024 * 1023;
     const result = pipe.transform(mb, 2);
     expect(result).toEqual('1023 MB');
   });
 
-  it('Should return 1023 MB #2', () => {
+  it('Should return 1023 MB, #2', () => {
     const kB = 1024 * 1023;
     const result = pipe.transform(kB, 2, 'kB');
     expect(result).toEqual('1023 MB');

components/pipe/nz-bytes.pipe.ts

@@ -16,7 +16,7 @@ export class NzBytesPipe implements PipeTransform {
   static formats: { [key: string]: { max: number; prev?: ByteUnit } } = {
     B: { max: 1024 },
     kB: { max: Math.pow(1024, 2), prev: 'B' },
-    KB: { max: Math.pow(1024, 2), prev: 'B' }, // Backward compatible
+    KB: { max: Math.pow(1024, 2), prev: 'B' },
     MB: { max: Math.pow(1024, 3), prev: 'kB' },
     GB: { max: Math.pow(1024, 4), prev: 'MB' },
     TB: { max: Number.MAX_SAFE_INTEGER, prev: 'GB' }

components/pipe/nz-css-unit.pipe.ts

@@ -10,7 +10,14 @@ import { Pipe, PipeTransform } from '@angular/core';
 })
 export class NzToCssUnitPipe implements PipeTransform {
   transform(value: number | string, defaultUnit: string = 'px'): string {
-    const formatted = +value; // force convert
-    return isNaN(formatted) ? `${value}` : `${formatted}${defaultUnit}`;
+    const absoluteLengthUnit = ['cm', 'mm', 'Q', 'in', 'pc', 'pt', 'px'];
+    const relativeLengthUnit = ['em', 'ex', 'ch', 'rem', '1h', 'vw', 'vh', 'vmin', 'vmax'];
+    const percentagesUnit = ['%'];
+    const listOfUnit = [...absoluteLengthUnit, ...relativeLengthUnit, ...percentagesUnit];
+    let unit = 'px';
+    if (listOfUnit.some(u => u === defaultUnit)) {
+      unit = defaultUnit;
+    }
+    return typeof value === 'number' ? `${value}${unit}` : `${value}`;
   }
 }

components/pipe/nz-math.pipe.ts

@@ -4,7 +4,6 @@
  */
 
 import { Pipe, PipeTransform } from '@angular/core';
-import { NzSafeAny } from 'ng-zorro-antd/core/types';
 import { sum } from '../core/util/number';
 
 export enum EMathMethod {
@@ -18,23 +17,10 @@ export enum EMathMethod {
   name: 'nzMath'
 })
 export class NzMathPipe implements PipeTransform {
-  getMethodResult(data: number[], method: string): number {
-    let result: number = data[0];
-    data.forEach((item: NzSafeAny) => {
-      if (method === EMathMethod.MAX) {
-        if (result < item) {
-          result = item;
-        }
-      } else if (method === EMathMethod.MIN) {
-        if (result > item) {
-          result = item;
-        }
-      }
-    });
-    return result;
+  private getMethodResult(data: number[], method: string): number {
+    return method === EMathMethod.MIN ? Math.min(...data) : Math.max(...data);
   }
-
-  transform(value: NzSafeAny, method: string): undefined | number {
+  transform(value: number[], method: string): undefined | number {
     if (!Array.isArray(value)) {
       return value;
     }