时间戳

首页 > 解决方案 > 点击语言作品 1 次 3

angular - 点击语言作品 1 次 3

问题描述

例如，当我选择一种语言时NL，我必须单击 2 次或 3 次才能以荷兰语正确显示文本。

我不明白为什么第一次点击不起作用？

图像

HTML

<div class="languageSelect">
 <a href="#" *ngFor="let l of supportedLangs;" (click)="switchLanguage(l); false; ">
   {{ l | uppercase}}
 </a>
</div>

TS

我认为问题出在我的打字稿上？

@Component({
  selector: 'app-auth-layout',
  templateUrl: './auth-layout.component.html',
  styleUrls: ['./auth-layout.component.scss']
})
export class AuthLayoutComponent implements OnInit {
  supportedLangs;

  constructor(
    public _router: Router,
    private translate: TranslateService,
    private LS: LocalStoreService,
    public _location: Location
  ) { }

  ngOnInit() {
    this.supportedLangs = ['fr', 'nl', 'en', 'de', 'es', 'it', 'pt'];
  }

  switchLanguage(lang) {
    if (lang == 'uk') {
      lang = 'en';
    }

    this.translate.onLangChange.subscribe((event: LangChangeEvent) => {
      this.LS.setItem('LX_Current_Language', event.lang);
    });
    this.translate.use(lang);

    this.refresh();
  }

  refresh(): void {
    this._router.navigateByUrl("/refresh", { skipLocationChange: true }).then(() => {
      this._router.navigate([decodeURI(this._location.path())]);
    });
  }
}

标签： angulartypescript

解决方案

我认为您必须像这样添加更改检测器：

你的构造函数

constructor(
public _router: Router,
private translate: TranslateService,
private changeDetectoref : ChangeDetectorRef,
private LS: LocalStoreService,
public _location: Location) { }

切换语言功能

switchLanguage(lang) {
if (lang == 'uk') {
  lang = 'en';
}

this.translate.onLangChange.subscribe((event: LangChangeEvent) => {
  this.LS.setItem('LX_Current_Language', event.lang);
});
this.translate.use(lang);
this.changeDetectorRef.detectChanges();
this.refresh();}

推荐阅读