Как перевести локальные данные JSON

Question

navbar.component.html

<div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav ml-auto">
            <li routerLinkActive="active" *ngFor="let menuItem of menuItems" class="{{menuItem.class}} nav-item">
                <a [routerLink]="[menuItem.path]" class="nav-link">{{menuItem.title}}</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="" data-toggle="modal" data-target="#myModal" (click)="showModal()"><i class="icon-search"></i></a>
            </li>
        </ul>
    </div>

navbar.comomponent.ts

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

import {TranslateService} from '@ngx-translate/core';

declare interface RouteInfo {
    path: string;
    title: string;
    class: string;
}
export const ROUTES: RouteInfo[] = [
    { path: '/home', title: 'Home', class: '' },
    { path: '/buyer_registration', title: 'Buyer Registration',  class: '' },
    { path: '/rate_contract', title: 'Rate Contract', class: '' },
    { path: '/login', title: 'Login', class: '' },
];

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})

export class NavbarComponent implements OnInit {
  menuItems: any[];

  constructor(translate: TranslateService) {
    translate.setDefaultLang('English');
    translate.use('English');
  }

  ngOnInit() {
    this.menuItems = ROUTES.filter(menuItem => menuItem);
  }
}

Как перевести локальные данные JSON?
У меня уже есть файл en и fr JSON в моем локальном

Answer 1

Я также сталкивался с этой проблемой.

В конце концов я использовал ngx-translate .Это просто в использовании!

Вот рабочий пример.

Answer 2

С помощью ngx-translate вы можете сделать именно это.Вы найдете пошаговое введение здесь:

Документация ngx-translate

И вам также следует проверить эту ссылку:

Как задать вопрос по stackoverflow

• Вы не предоставили достаточно кода для воспроизведения проблемы (например, отсутствует файл app.module.ts)
• Нет в прямом эфирепример создан
• Заголовок: тема слишком широкая