Get started with angular-gettext CDN

import { Component } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { getText } from 'angular-gettext';

// Set up the TranslateModule with the HttpLoader
export function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http);
}

@Component({
  selector: 'app-root',
  template: `
    <p>{{ 'WELCOME_MESSAGE' | translate }}</p>
  `
})
export class AppComponent {
  constructor(private translate: TranslateService) {
    // Initialize the TranslateService with the HttpLoader
    translate.setDefaultLang('en');
    translate.use(HttpLoaderFactory);

    // Load translations asynchronously
    translate.get('messages').subscribe((messages: any) => {
      translate.addLangs(['en', 'fr']);
      translate.registerTranslation('en', messages);
      translate.registerTranslation('fr', messages);
    });
  }
}

// Define the messages for the translations
const messages = {
  'WELCOME_MESSAGE': getText('Welcome to Angular Gettext!')
};