使用 i18n 进行 md-select 初始化

Question

我正在使用 Angular-material 和 I18next。这是我的简单示例：

<md-select ng-init="val='en'" ng-model="val">
    <md-option ng-value="en">{{'en' | i18next}}</md-option>
    <md-option ng-value="de">{{'de' | i18next}}</md-option>
</md-select>

选择标题初始化为“en”而不是“English”。但是一旦我选择了其他值，正确的国际化值就会显示为新的选择标题。

知道如何从其初始化中获取显示国际化值的选择元素吗？

谢谢， 最大

注意如果我直接使用“English”或与选项中的值不同的任何其他值进行初始化，则选择元素根本不会被初始化。

更新：看起来 md-select 元素标题在 md-option 元素内部值被国际化之前被初始化。我不知道如何解决这个问题。

Answer 1

这是您所指的旧 angular-material.js 中的错误 Github Issue 并且已在较新版本中得到解决。

尝试将您的 angular-material.js 更新为最新（版本 1.3.6）将正确选择值。

HTML

<md-select ng-init="val='en'" ng-model="val">
    <md-option ng-value="en">{{'en' | i18next}}</md-option>
    <md-option ng-value="de">{{'de' | i18next}}</md-option>
</md-select>

Working Plunkr

更新

为了使用i18next过滤器下拉预选值，您需要设置 useLocalStorage 选项为 true 以保留所有文件，例如 ``useLocalStorage: true,`

配置

app.config(['$i18nextProvider',
  function($i18nextProvider) {
    $i18nextProvider.options = {
      fallbackLng: 'en',
      useCookie: true,
      useLocalStorage: true, //set to true
      resGetPath: 'i18n-__lng__.json',
      lngWhitelist: ['en', 'de'],
      preload: ['en', 'de']
    };
  }
]);

Updated Plunkr

希望对您有所帮助，谢谢。