Angular: get i18n phrase in the code

component.html

<app-locale i18n-phrase-key phrase-key="Phrase One"
            i18n-phrase-key-2 phrase-key-2="Phrase Two"
            ...
            >
</app-locale>

component.ts

...

export class Component {

  @ViewChild(LocaleComponent) locale: LocaleComponent;

  ...

  const translatedPhrase = this.locale.t('phrase-key');

}

locale.component.ts

import { Component, ElementRef } from '@angular/core';

@Component({
  selector: 'app-locale',
})
export class LocaleComponent {

  constructor(private el: ElementRef) { }
  
  t(key: string): string {
    if (this.el.nativeElement.hasAttribute(key)) {
      return this.el.nativeElement.getAttribute(key);
    }
    else {
      throw new Error(`Locale component does not have ${key} attribute`);
    }
  }

}