kutanov

@Component({
  selector: 'app-comp',
  templateUrl: './app-comp.component.html',
  providers: [
    {
      provide: TRANSLOCO_LOADING_TEMPLATE,
      useValue: '<p>Translation is loading...</p>'
    }
  ]
})

kutanov

import { TestBed, async } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
import { getTranslocoModule } from './transloco-testing.module';

describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        getTranslocoModule(),

kutanov

import { TranslocoMessageFormatModule } from '@ngneat/transloco-messageformat';

@NgModule({
  imports: [
    TranslocoMessageFormatModule.init()
  ]
})

kutanov

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
import { TranslocoRootModule } from './transloco-root.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TranslocoLocaleModule } from '@ngneat/transloco-locale';

kutanov

  onChange(target) {
  	this.translocoService.setActiveLang(target);
  }

kutanov

<h5>{{ componentVariable }}</h5>
<h5>{{ componentVariableSecond }}</h5>
<label for="lang">Choose a language:</label>
<select (change)="onChange($event.target.value)" id="lang">
  <option *ngFor='let l of languages' [value]="l.code">{{l.label | transloco }}</option>
</select>

kutanov

  {
    "title": "English title",
    "hello": "Welcome",
    "containers": "ng-containers are useful when you don't want to have too many html layers",
    "dashboard": {
      "description": "You may use scopes for structuring translations"
    }
  }

kutanov

  import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { HomeComponent } from './home.component';
  import { RouterModule } from '@angular/router';
  import { TranslocoRootModule } from '../transloco-root.module';
  import { TranslocoLocaleModule } from '@ngneat/transloco-locale';


  @NgModule({
    declarations: [

kutanov

  import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { HomeComponent } from './home.component';
  import { RouterModule } from '@angular/router';
  import { TranslocoRootModule } from '../transloco-root.module';
  import { TranslocoLocaleModule } from '@ngneat/transloco-locale';


  @NgModule({
    declarations: [

kutanov

  import { HttpClient } from '@angular/common/http';
  import {
    TRANSLOCO_LOADER,
    Translation,
    TranslocoLoader,
    TRANSLOCO_CONFIG,
    translocoConfig,
    TranslocoModule
  } from '@ngneat/transloco';
  import { Injectable, NgModule } from '@angular/core';