Come mantenere la lingua selezionata in LocalStorage mentre si utilizza Angular-translate?

Sono nuovo a angular-translate nella mia app Angolare.Come mantenere la lingua selezionata in LocalStorage mentre si utilizza Angular-translate?

Requisito:

devo creare un'applicazione multi lingua in AngularJS dove l'utente ha la possibilità di impostare il suo linguaggio. Quindi, per questo devo caricare le traduzioni dai file e salvare quella lingua preferita in localStorage. In modo che se l'utente viene di nuovo ad accedere all'applicazione verrà visualizzata la lingua precedentemente impostata.

quello che ho fatto finora:

traduzioni caricati da file utilizzando $translateProvider.useStaticFilesLoader

Codice:

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

applicazione funziona bene se io commento questa riga:

// $translateProvider.useLocalStorage();

Ma se lo uso, sto ottenendo questo errore sulla console:

Ho incluso anche il file angular-translate-storage-local.min.js nel mio index.html .Ma senza successo.

Ho anche visto queste domande in SO, ma non aiutano: Angular-translate's localStorage: Unknown provider: $translateLocalStorageProvider

Qualsiasi aiuto immediato sarà altamente apprezzabile. Grazie

fonte

2015-10-06 Rohit Jindal

Possibile duplicato del [Angular-translate del localStorage: Unknown fornitore: $ translateLocalStorageProvider] (http://stackoverflow.com/questions/30287185/angular-translates-localstorage-unknown-provider-translatelocalstorageprovid) – Aks

Includere anche questo: https://github.com/angular-translate/bower-angular-translate-storage-cookie – Aks

Penso che questo potrebbe aiutarti. http://stackoverflow.com/questions/22364503/angular-translateprovider-issue-with-uselocalstorage –

Ecco il documentation sullo storage con angolare traducono

Cosa vi accorgerete subito dopo la lettura è che il angolare translate- la libreria locale storage deve essere utilizzata insieme alla libreria angular-translate-storage-cookie. Poiché la memoria locale non è supportata su alcuni dei browser più vecchi (esempio: IE 7 o inferiore), angular translate vuole avere un'opzione di fallback per usare i cookies quando la memoria locale non farà il trucco.

L'errore è causato da angolare-translate-storage locale cercando di iniettare la sua caduta indietro opzione angolare-translate-storage-cookie.

Per ovviare a questo problema, è necessario installare angular-translate-local-cookie.

Attenzione che angular-translate-local-cookie tenta di iniettare ngCookie che è una libreria che dovrete installare e impostare l'iniezione delle dipendenze per la vostra app. L'iniezione deve essere

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

Inoltre, l'ordine sbagliato dei file includere nel index.html può anche causare problemi per voi. L'ordine corretto dovrebbe essere

<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>

fonte

2015-11-04 20:42:46

nella mia app ho anche commentare $translateProvider.useLocalStorage(); ma ho aggiunto

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

Ho diversi file JSON, uno per ogni Lang, e con il func

$translate.use('fr')

a cambiare la lingua dell'interfaccia utente ogni volta che l'utente cambia il lang lo salvo nella memoria locale e lo uso su startUp all'interno del $ translate.use

fonte

2015-10-06 10:55:15 David

Sono d'accordo con te. Ma la mia domanda è diversa. Voglio salvare la lingua dell'utente nella memoria locale. in modo che se l'utente ritorna sull'app non è necessario selezionare nuovamente la lingua. –

'$ translateProvider.preferredLanguage (' en ')' imposta il lang predefinito, – David

'$ translateProvider.preferredLanguage (' en ')' imposta il lang predefinito, puoi creare una funzione di avvio che controllerà se c'è un salvataggio valore lang nel localStorage e lo applicherà utilizzando: '$ translate.use (window.localStorage.getItem (' CLIENT_LANG '))' e in un'altra funzione quando l'utente deciderà di cambiare l'interfaccia utente che verrà generato: ' changeLang (langKey) { $ translate.use ("" + langKey); window.localStorage.setItem ('CLIENT_LANG', langKey); } ' – David

Ciao cercare di includere questi due file js nella vostra pagina di indice

angolari-translate-stoccaggio-local.js
angolare-translate-storage-biscotto.js

o (se si utilizza Bower)

<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>

fonte

2015-10-20 19:42:34 CaptainNemo

Come mantenere la lingua selezionata in LocalStorage mentre si utilizza Angular-translate?

risposta

Problemi correlati