In the tutorial, we show how to work with Angular impure built-in SlicePipe to create a new Array or String containing a subset of the elements.
The slice pipe in Angular is a pipe that can be used to slice an array or a string into a new array or string. It takes two arguments: the starting index and the ending index. The resulting array or string will include all the elements or characters from the starting index up to, but not including, the ending index.
For example:
import { Component } from '@angular/core';
@Component({
selector: 'my-component',
template: `
`
})
export class MyComponent {
items = [1, 2, 3, 4, 5];
}
In this example, the slice pipe will slice the items array into a new array that includes only the elements at indices 1 and 2 (the second and third elements). The resulting array will be [2, 3], and the template will display a list with two list items: 2 and 3.
The slice pipe can also be used with strings. For example:
import { Component } from '@angular/core';
@Component({
selector: 'my-component',
template: `
{{ message | slice:0:5 }}
`
})
export class MyComponent {
message = 'Hello World';
}
In this example, the slice pipe will slice the message string into a new string that includes only the characters at indices 0 through 4 (the first five characters). The resulting string will be ‘Hello’, and the template will display a paragraph with the text ‘Hello’.
Related posts:
– Angular Built-in KeyValue Pipe
– Angular Built-in DatePipe
– Angular Custom Pipe | Pure Pipe + Impure Pipe
– Angular 6 Service – with Observable Data for Asynchronous Operation
Related pages:
Continue reading “Angular built-in Slice Pipe | Array SlicePipe + String SlicePipe Example”