Proposal - Support change detection for Intl services.

Bug, feature request, or proposal: Proposal

What is the expected behavior?

Changing text in I18N (XXXIntl services) should reflect dynamically on components with OnPush change detection stratagy

What is the current behavior?

Intl services are simple classes, changing properties will not reflect in OnPush components unless they can be notified.

What is the use-case or motivation for changing an existing behavior?

Using libraries like ngx-translation or others that support dynamic, on the fly, language replacement..

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

All

Is there anything else we should know?

This feature can be supported in multiple ways.

It requires the Intl service to provide an emitter that fires events when a property changes.
The component using that service can listen to those changes and trigger CD.
This should probably go though a base Intl service that all Intl services extend.

There are 2 design aspect to resolve:

Emitting changes

The logic for emitting can be passive (transparent) or active (user initiated)
A Passive approach requires each property on the service to be a getter/setter and emit when set.
Active approach requires the user to run a method once the service is ready to update.

While the passive approach requires nothing from the user, it will require some boilerplate in the library and will emit on every property which isn't suitable for bulk changes although can be handled. The active approach requires an extra step but in most cases it is acceptable since this should happen once a language has changed.

Handling changes

This is an internal implementation in the components, which can be property specific or global.
Property specific means registering each property in a service as an observable and using the templates with async pipe to set the value. This approach comes with it's boilerplate and multiple subscriptions but it offers transparent CD integration and rx subscription management since everything is handled by angular. It also means that the services will have to export observables which is somewhat complex.

A global approach means subscribing to a service's change stream and acting upon it.
In practice it has much less boilerplate and it keeps the same template structure used today, it will only require registering to the change stream, run change detection on each hit and unsubscribing on destruction.

angular / components