arrayJoin
The arrayJoin pipe is an Angular pipe that joins array elements into a string using a specified separator. It provides a convenient way to display array data as comma-separated or custom-delimited strings in templates.
Examples
Example 1: Basic Usage
Join array elements with the default comma separator:
import {ArrayJoinPipe} from 'ngx-lift';
@Component({
imports: [ArrayJoinPipe],
template: `
<p>{{ [1, 2, 3, 4] | arrayJoin }}</p>
<!-- Output: "1,2,3,4" -->
`
})
export class ArrayJoinExampleComponent {}
Example 2: Custom Separators
Use different separators for various use cases:
import {ArrayJoinPipe} from 'ngx-lift';
@Component({
imports: [ArrayJoinPipe],
template: `
<p>{{ ['apple', 'orange', 'banana'] | arrayJoin: ';' }}</p>
<!-- Output: "apple;orange;banana" -->
<p>{{ ['John', 'Doe'] | arrayJoin: ' - ' }}</p>
<!-- Output: "John - Doe" -->
`
})
export class ArrayJoinExampleComponent {}
Example 3: Numeric Arrays
Join numeric arrays with different separators:
import {ArrayJoinPipe} from 'ngx-lift';
@Component({
imports: [ArrayJoinPipe],
template: `
<p>{{ [10, 20, 30] | arrayJoin }}</p>
<!-- Output: "10,20,30" -->
<p>{{ [100, 200, 300] | arrayJoin: ' | ' }}</p>
<!-- Output: "100 | 200 | 300" -->
`
})
export class ArrayJoinExampleComponent {}
API Reference
arrayJoin
Angular pipe that joins array elements into a string using a specified separator.
Signature
transform(value: unknown, separator?: string): string | unknown
Parameters
value: unknownThe array to join. If not an array, returns the value as-is.
separator?: string(Optional) The separator string to use between array elements. Defaults to ','.
Returns
A string containing the joined array elements, or the original value if not an array.