ngx-translate default text if key is missing or translation file is being loaded

Question

I'm setting up a new Angular 7 app. I want to set a default text for translation. So in the translation {{ 'wait' | translate }}, I want to set text 'Waiting Now' as default text if there are any fallback. Means if data is being loaded or key is missing then passed value (in this case Waiting Now) should appear.

I was trying to do something like {{ 'Intro' | translate:'localizedText' }}

Not didn't worked

{{ 'Intro' | translate:'localizedText' }}

I expect result should come as

{{ 'Intro' | translate:'localizedText' }} => Intro (If being loaded or missing key)

{{ 'Intro' | translate:'localizedText' }} => translated text

Answer 1

I followed the instructions to create a missing translations handler here: https://github.com/ngx-translate/core#how-to-handle-missing-translations

But my version allows passing a default value to the pipe like this

<span>{{"MyTranslateKey" | translate: {Default: "Default Translation"} }}</span>

The default can be a specific string as above, or a variable.

Here is my handler:

import {MissingTranslationHandler, MissingTranslationHandlerParams} from '@ngx-translate/core';

export class MissingTranslationHelper implements MissingTranslationHandler {
  handle(params: MissingTranslationHandlerParams) {
    if (params.interpolateParams) {
      return params.interpolateParams["Default"] || params.key;
    }
    return params.key;
  }
}