ค้นหาเว็บไซต์

typescript - เปลี่ยนภาษาท้องถิ่นใน Angular 7 แบบไดนามิกขณะรันไทม์โดยไม่ต้องโหลดแอปใหม่


ฉันกำลังพยายามเปลี่ยน Locale_Id ในแอป Angular ของฉันขณะรันไทม์ แต่ต้องใช้ window.location.reload() เพื่อให้การเปลี่ยนแปลงของ locale ทำงาน

ฉันต้องการเปลี่ยนภูมิภาคโดยไม่โหลดแอปของฉันใหม่

นี่คือโค้ดของฉัน:

แอป.โมดูล

import { LOCALE_ID } from '@angular/core';
import { LocaleService} from "./services/locale.service";

@NgModule({
    imports: [//imports],
    providers: [
        {provide: LOCALE_ID,
         deps: [LocaleService],
         useFactory: (LocaleService: { locale: string; }) => LocaleService.locale
        }
    ]})

บริการภูมิภาค

import { Injectable } from '@angular/core';
import { registerLocaleData } from '@angular/common';
import localeEnglish from '@angular/common/locales/en';
import localeArabic from '@angular/common/locales/ar';

@Injectable({ providedIn: 'root' })
export class LocaleService{

    private _locale: string;

    set locale(value: string) {
        this._locale = value;
    }
    get locale(): string {
        return this._locale || 'en';
    }

    registerCulture(culture: string) {
        if (!culture) {
            return;
        }
        this.locale = culture;

        switch (culture) {
            case 'en': {
                registerLocaleData(localeEnglish);
                break;
            }
            case 'ar': {
                registerLocaleData(localeArabic);
                break;
            }
        }
    }
}

ส่วนประกอบของแอป

import { Component } from '@angular/core';
import { LocaleService} from "./services/locale.service";

@Component({
  selector: 'app-root',
  template: `
    <p>Choose language:</p>
    <button (click)="english()">English</button>
    <button (click)="arabic()">Arabic</button>
  `
})
export class AppComponent {

  constructor(private session: LocaleService) {}

  english() {
    this.session.registerCulture('en');
    window.location.reload(); // <-- I don't want to use reload
  }

  arabic() {
    this.session.registerCulture('ar');
    window.location.reload(); // <-- I don't want to use reload
  }
}

บทความที่เกี่ยวข้อง