Add JoinPipe to @angular/common

Which @angular/* package(s) are relevant/releated to the feature request?

common

Description

In component templates, it’s common to join an array of data with some separator:

<p>{{ myData.join(', ') }}</p>

But function calls are evaluated every change detection cycle, so this could incur a hefty performance cost for large arrays. In those cases, a pipe could improve the performance of the operation.

Proposed solution

@angular/common should offer a JoinPipe that accepts an Array as input and returns the result of Array.prototype.join called with a given separator (, by default, matching the spec).

Alternatives considered

Applications can create a JoinPipe if they need it (large applications have probably done this already). But this could result in many different implementations of the pipe in the wild, several of which might unintentionally reimplement Array.prototype.join, resulting in unnecessary code shipped to users. A standard implementation is preferred.

[petebacondarwin]

While it is true that a join pipe is fairly common and would benefit from being in a shared package, this could be said for a number of other similar operations. There are already libraries out there that offer this, which application developers could leverage. Consider https://fknop.gitbook.io/angular-pipes/documentation/array for example. This library has dozens of pipes for many scenarios.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}