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: unknown

    The 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.