要求:
我必须在AngularJS中创建一个多语言应用程序,用户可以选择设置他的语言.因此,为此,我必须从文件加载翻译并在localStorage中保存该首选语言.
因此,如果用户再次访问该应用程序,他将显示先前设置的语言.
到目前为止我做了什么:
使用$translateProvider.useStaticFilesLoader从文件加载的翻译
代码:
var app = angular.module("myLangApp",['pascalprecht.translate']) app.config(function($translateProvider) { $translateProvider.useStaticFilesLoader({ prefix: 'languages/',suffix: '.json' }); $translateProvider.useLocalStorage(); });
如果我评论此行,应用程序工作正常:
// $translateProvider.useLocalStorage();
但是,如果我使用它,我在控制台上收到此错误:
我还在index.html中包含了angular-translate-storage-local.min.js文件.但没有成功.
我也在SO中看到了这些问题,但它们没有帮助:
Angular-translate’s localStorage: Unknown provider: $translateLocalStorageProvider
任何直接的帮助都将非常值得注意.谢谢
在阅读之后你很快就会意识到,angular-translate-storage-local库应该与angular-translate-storage-cookie库一起使用.由于某些较旧的浏览器(例如:IE 7或更低版本)不支持本地存储,因此当本地存储无法执行此操作时,角度转换需要具有使用cookie的后备选项.
该错误是由angular-translate-storage-local尝试注入其后备选项angular-translate-storage-cookie引起的.
要解决此问题,您需要安装angular-translate-local-cookie.
请注意angular-translate-local-cookie尝试注入ngCookie,这是一个您必须安装的库,并为您的应用设置依赖注入.注射应该是
var app = angular.module('myApp',['ngCookies','pascalprecht.translate']);
此外,index.html中包含文件的错误排序也会给您带来问题.应该是正确的顺序
<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>