在下拉菜单中保存最后选择的选项

Question

我是 angular 的新手，我正在尝试保存选择选项标签，但是语言已成功保存，即使我选择阿拉伯语，选择选项默认显示英语，当页面刷新时它会恢复为英语，如果您能帮助我实现这一目标，我将不胜感激页脚.component.html<div class="form-group">   <select (change)="switchLanguage($event)" [ngModel]="lang" style="background-color:        #b3cee5;" class="form-control customized-dropdown alignleft">       <option id="myLanguage" *ngFor="let item of Languages">{{item}}</option>   </select></div>页脚.component.tsdirectionEn: any;directionAr: anylanguage;userLang;localsettings: LocalSettingsService;Languages : any = ['English', 'Arabic'];lang;constructor(private translate: TranslateService) {  translate.setDefaultLang('en');}switchLanguage(event) {if(event.target.value == 'English'){  this.language = 'en'  this.lang = event.target.value;  this.ChangeToEnglish()} else if(event.target.value == 'Arabic'){  this.language = 'ar'  this.lang = event.target.value;  this.ChangeToArabic();}this.translate.use(this.language);localStorage.setItem('lang', this.lang)localStorage.setItem('language', this.language);}ChangeToEnglish(){  document.querySelector('body')  .setAttribute('style', 'direction: ltr; text-align: left; ');}ChangeToArabic(){  document.querySelector('body')   .setAttribute('style', 'direction: rtl; text-align: right;');}ngOnInit() {  var language = localStorage.getItem('language')  var lang = localStorage.getItem('lang')if(language === 'ar' && lang === "Arabic"){  this.translate.use('ar');  this.ChangeToArabic();}else if(language === 'en' && lang === "English"){  this.translate.use('en');  this.ChangeToEnglish()}}

Answer 1

试试这个

constructor(private translate: TranslateService) {

  translate.setDefaultLang(localStorage.getItem('language') ? localStorage.getItem('language') : 'en');

}

Answer 2

我终于找到了解决方案，您只需为每个语句添加一个变量，如下所示：

页脚.component.ts

ngOnInit() {

  var language = localStorage.getItem('language')

  var lang = localStorage.getItem('lang')

if(language === 'ar' && lang === "Arabic"){

  this.translate.use('ar');

  this.ChangeToArabic();

  this.bind = "Arabic";

}

else if(language === 'en' && lang === "English"){

  this.translate.use('en');

  this.ChangeToEnglish()

  this.bind = "English";

}

页脚.component.html

只需将 [(ngModel)]="bind" 添加到选择标签

<select (change)="switchLanguage($event)" [(ngModel)]="bind"

    style="background-color: #b3cee5;" class="form-control>

  <option id="myLanguage" *ngFor="let item of Languages">{{item}}</option>

 </select>