Pipes

NG-ZORRO experiments are features that are released but not yet considered stable or production ready
Developers and users can opt-in into these features before they are fully released. But breaking changes may occur with any release.

Common Pipe Collections in Projects

When To Use#

After introducing Pipe, use it like angular's default Pipe

import { NzPipesModule } from 'ng-zorro-antd/pipes';

Examples

200 B
1 kB
1 MB
1 MB
1 GB
1 TB
1024 MB

nzBytes

Conversion of storage units to increase readability

      Loading...

Default

rem

nzToCssUnit

Css unit

Tip: If possible, we prefer to use Angular's built-in syntax, for example:

<div [style.border-radius.px]="1">px</div>
<div [style.border-radius.%]="1">%</div>
<div [style.border-radius.rem]="1">rem</div>

      Loading...

Ant Design, a design language for ba...

nzEllipsis

Truncate the string, ending with the specified string

      Loading...

Max [7, 8, 2, 3]

Min [7, 8, 2, 3]

Sum [7, 8, 2, 3]

Avg [7, 8, 2, 3]

nzAggregate

Sum, Min, Max, Average and other operations on arrays

      Loading...

Name	Age	Address
John Brown	32	-
Jim Green	42	-
Joe Black	32	Sidney No. 1 Lake Park

nzSafeNull

Convert Null and Undefined to the specified string

WARNING: Deprecated in v17.0.0, please use the nullish coalescing operator (??) instead, eg:

{{ value ?? '-' }}

      Loading...

I am innerHTML

nzSanitizer

Pipe implementation of DomSanitizer

<div [innerHTML]="html | nzSanitizer: 'html'"></div>
<div [style]="style | nzSanitizer: 'style'"></div>
<img [src]="url | nzSanitizer: 'url'" />
<iframe [src]="resourceUrl | nzSanitizer: 'resourceUrl'"></iframe>

      Loading...

 Ant Design

Ant Design

nzTrim

Strip left and right empty string

      Loading...

API#

nzSafeNullstandalone#

Property	Description	Type	Default
`replace`	Replace character	`string`	''

nzBytesstandalone#

Property	Description	Type	Default
`decimal`	Decimal	`number`	'0'
`from`	Unit of current value	`string`	'B'
`to`	Units converted to target value	`string`	''

nzToCssUnitstandalone#

Property	Description	Type	Default
`defaultUnit`	Default Unit	`string`	'px'

nzEllipsisstandalone#

Property	Description	Type	Default
`length`	Truncate length	`number`	''
`suffix`	Replace character	`string`	''

nzAggregatestandalone#

Property	Description	Type	Default
`method`	Aggregation	`'sum' \| 'max' \| 'min' \| 'avg'`	''

nzSanitizerstandalone#

Property	Description	Type	Default
`type`	sanitizer type	`string`	'html'