6

我是Angular 应用程序中角度翻译的新手。

要求 :

我必须创建一个多语言应用程序,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();

但如果我使用它,我会在控制台上收到此错误:

上述代码的控制台错误。

我也将angular-translate-storage-local.min.js文件包含在我的index.html. 但没有成功。

我也在 SO 中看到了这些问题,但它们没有帮助: Angular-translate's localStorage: Unknown provider: $translateLocalStorageProvider

任何直接的帮助都将是非常可观的。谢谢

4

3 回答 3

8

这是有关带有角度转换的存储的文档

阅读后您很快就会意识到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>
于 2015-11-04T20:42:46.153 回答
0

在我的应用程序中,我也发表了评论$translateProvider.useLocalStorage(); ,但我添加了

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

我有不同的 json 文件,每个 lang 一个,并且带有 func

$translate.use('fr') 

每次用户更改语言时,我都会更改 ui 语言,我将其保存在本地存储中并在 $translate.use 内的启动时使用它

于 2015-10-06T10:55:15.020 回答
0

您好尝试将这两个js文件包含到您的索引页面中

  • 角度翻译-存储-local.js
  • 角翻译存储cookie.js

或者(如果你使用 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>
于 2015-10-20T19:42:34.590 回答