pipe
impure
Creates a new Array
or String
containing a subset (slice) of the elements.
{{ value_expression | slice : start [ : end ] }}
value | string | ReadonlyArray |
start | number | |
end | number | Optional. Default is |
All behavior is based on the expected behavior of the JavaScript API Array.prototype.slice()
and String.prototype.slice()
.
When operating on an Array
, the returned Array
is always a copy even when all the elements are being returned.
When operating on a blank value, the pipe returns the blank value.
This ngFor
example:
@Component({ selector: 'slice-list-pipe', template: `<ul> <li *ngFor="let i of collection | slice:1:3">{{i}}</li> </ul>` }) export class SlicePipeListComponent { collection: string[] = ['a', 'b', 'c', 'd']; }
produces the following:
<li>b</li> <li>c</li>
@Component({ selector: 'slice-string-pipe', template: `<div> <p>{{str}}[0:4]: '{{str | slice:0:4}}' - output is expected to be 'abcd'</p> <p>{{str}}[4:0]: '{{str | slice:4:0}}' - output is expected to be ''</p> <p>{{str}}[-4]: '{{str | slice:-4}}' - output is expected to be 'ghij'</p> <p>{{str}}[-4:-2]: '{{str | slice:-4:-2}}' - output is expected to be 'gh'</p> <p>{{str}}[-100]: '{{str | slice:-100}}' - output is expected to be 'abcdefghij'</p> <p>{{str}}[100]: '{{str | slice:100}}' - output is expected to be ''</p> </div>` }) export class SlicePipeStringComponent { str: string = 'abcdefghij'; }
© 2010–2021 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v12.angular.io/api/common/SlicePipe