我试图做的是,当用户在我的网站上选择他们的语言首选项时,它将被存储,这样如果他们要刷新页面或返回,他们选择的语言仍然存在。
我在 Angular 中执行此操作,这是我的代码:
export class AppComponent implements OnInit {
title: string = 'app';
currentLanguage: string;
currentPage: string;
@ViewChild('bottom') bottomSection: ElementRef;
@ViewChild('top') topSection: ElementRef;
constructor(private global: GlobalProvider, private translate: TranslateService, private scrollService: ScrollToService, private elementRef: ElementRef, private route: ActivatedRoute, private router: Router) {
translate.setDefaultLang('en');
this.changeLanguage('en');
this.currentLanguage = localStorage.getItem(this.currentLanguage);
}
changeLanguage(language: string) {
this.translate.use(language);
this.currentLanguage = language;
localStorage.setItem(this.currentLanguage, language);
}
页面上的语言更改正常,但我似乎无法让本地存储工作。我是初学者,所以答案可能很明显,但谁能向我解释我做错了什么以及如何存储语言首选项?
要使用本地存储,您应该使用key
value
对。
此行中的代码存在问题。
localStorage.setItem(this.currentLanguage, language);
因此,每次一个名为 this.currentLanguage
的新变量都将存储在本地存储中。
试试这个来存储项目:
localStorage.setItem('selectedLanguage', language);
要获取项目:
localStorage.getItem('selectedLanguage');