Wie behalte ausgewählte Sprache in LocalStorage während der Verwendung von Angular-translate?

Ich bin neu zu angular-translate in meiner Angular App.Wie behalte ausgewählte Sprache in LocalStorage während der Verwendung von Angular-translate?

Voraussetzung:

Ich habe eine mehrsprachige Anwendung in AngularJS zu schaffen, in dem Benutzer eine Option, seine Sprache zu setzen hat. Also, dafür muss ich Übersetzungen von Dateien laden und diese bevorzugte Sprache in localStorage speichern. Wenn der Benutzer erneut auf die Anwendung zugreift, wird ihm die zuvor eingestellte Sprache angezeigt.

Was ich bisher getan haben:

Loaded Übersetzungen von Dateien mithilfe $translateProvider.useStaticFilesLoader

Code:

var app = angular.module("myLangApp", ['pascalprecht.translate']) 
app.config(function($translateProvider) { 
$translateProvider.useStaticFilesLoader({ 
     prefix: 'languages/', 
     suffix: '.json' 
     }); 
    $translateProvider.useLocalStorage(); 
});

Anwendung funktioniert gut, wenn ich diese Zeile kommentieren:

// $translateProvider.useLocalStorage();

Aber wenn ich es verwenden, erhalte ich diesen Fehler auf der Konsole:

Ich habe auch die angular-translate-storage-local.min.js Datei in meinem index.html .Aber ohne Erfolg.

Ich habe auch diese Fragen in SO gesehen, aber sie helfen nicht: Angular-translate's localStorage: Unknown provider: $translateLocalStorageProvider

Jede sofortige Hilfe sehr spürbar sein wird. Dank

Quelle

2015-10-06 Rohit Jindal

Mögliche Duplikat sein [Angular-translate der localstorage: Unknown Anbieter: $ translateLocalStorageProvider] (http://stackoverflow.com/questions/30287185/angular-translates-localstorage-unknown-provider-translatelocalstorageprovid) – Aks

Dazu gehören auch: https://github.com/angular-translate/bower-angular-translate-storage-cookie – Aks

Ich denke, das könnte Ihnen helfen. http://stackoverflow.com/questions/22364503/angular-translateprovider-issue-with-uselocalstorage –

Hier ist der documentation unverträglichen Winkel

übersetzen

Was Sie bald nach der Lektüre erkennen werde es ist, dass die Winkel translate- Speicher-lokale Bibliothek soll zusammen mit der angular-translate-storage-cookie Bibliothek verwendet werden. Da lokaler Speicher in einigen älteren Browsern nicht unterstützt wird (Beispiel: IE 7 oder niedriger), möchte angular translate eine Möglichkeit haben, Cookies zu verwenden, wenn der lokale Speicher nicht ausreicht.

Der Fehler wird verursacht durch Winkel-translate-Speicher-local versucht, seine Rückfalloption Winkel-translate-storage-Cookie zu injizieren.

Um dieses Problem zu umgehen, sollten Sie angular-translate-local-cookie installieren.

Beachten Sie, dass Winkel übersetzen-local-Cookie ngCookie zu injizieren versucht, die eine Bibliothek ist, dass Sie auch installieren als die Dependency Injection für Ihre Anwendung festgelegt. Die Injektion sollte

var app = angular.module('myApp', ['ngCookies', 'pascalprecht.translate']);

Auch die falsche Reihenfolge der Include-Dateien in Ihrem Index.html kann auch Probleme für Sie verursachen. Die richtige Reihenfolge sollte

<script type="text/javascript" src="vendor/angular-cookies/angular-cookies.min.js"></script> 
<script type="text/javascript" src="vendor/angular-translate-storage-cookie/angular-translate-storage-cookie.min.js"></script> 
<script type="text/javascript" src="vendor/angular-translate-storage-local/angular-translate-storage-local.min.js"></script>

Quelle

2015-11-04 20:42:46

in meiner app ich auch Kommentar $translateProvider.useLocalStorage(); aber ich hinzugefügt

$translateProvider.preferredLanguage('en'); 
$translateProvider.useStaticFilesLoader({ 
    prefix: 'languages/', 
    suffix: '.json' 
});

Ich habe verschiedene JSON-Dateien, eine für jede lang und mit der Func

$translate.use('fr')

ich die Sprache der Benutzeroberfläche ändern Jedes Mal, wenn der Benutzer die Sprache ändere, speichere ich ihn im lokalen Speicher und verwende ihn bei StartUp innerhalb der $ translate.use

Quelle

2015-10-06 10:55:15 David

Ich stimme dir zu. Aber meine Frage ist anders. Ich möchte die Benutzersprache im lokalen Speicher speichern. Wenn der Benutzer erneut auf die App zugreift, muss die Sprache nicht erneut ausgewählt werden. –

die '$ translateProvider.preferredLanguage (' en ')' setzen die Standard-Sprache lang, – David

die '$ translateProvider.preferredLanguage (' en ')' setzen Sie die Standard-Sprache lang, Sie können eine StartUp-Funktion erstellen, die prüft, ob ein gespeichert ist lang Wert in der localStorage und wird es anwenden mit: '$ translate.use (window.localStorage.getItem (' CLIENT_LANG '))' und in einer anderen Funktion, wenn der Benutzer entscheiden wird, die Sprache zu ändern, die Sie bauen: ' changeLang (langKey) { $ translate.use ("" + langKey); window.localStorage.setItem ('CLIENT_LANG', langKey); } ' – David

Hallo Versuchen Sie, diese beiden js Dateien in Ihre Indexseite

Winkel-translate-storage-local.js
Winkel-translate-storage-Cookie enthalten.js

oder (wenn Sie Bower verwenden)

<script src="bower_components/angular-translate-storage-local/angular-translate-storage-local.js"></script> 
<script src="bower_components/angular-translate-storage-cookie/angular-translate-storage-cookie.js"></script>

Quelle

2015-10-20 19:42:34 CaptainNemo

Wie behalte ausgewählte Sprache in LocalStorage während der Verwendung von Angular-translate?

Antwort

Verwandte Themen