javascript - selectize.js 的占位符翻译

Question

我正在尝试向 selectize.js 中的占位符添加翻译。

但是，它在翻译方面似乎有不同的行为。

例如

<selectize config='selectizeConfig' placeholder='keyword' ng-click="clear()"
options="myOptions" ng-model="selected"></selectize>

当我尝试这样做时，

placeholder="{{'keyword'| translate }}"

它不起作用!虽然它适用于 uib-tooltip 和其他类似的东西。

<input type="text" placeholder="{{'keyword'| translate}}"/>

有什么想法吗？

Answer 1

因此，当您使用 angular-selectize 时，您可以选择在配置对象中设置占位符。更喜欢它而不是在 DOM 上具有占位符属性。所以你的配置对象可能看起来像:

$scope.myConfig = {
    create: true,
    onChange: function(value){
      console.log('onChange', value)
    },
    placeholder : $scope.placeholder
}

其中 $scope.placeholder 在controller中定义如下:

$scope.placeholder = $filter('translate')('PLACEHOLDER');

这里的 'PLACEHOLDER' 是一个翻译 id。因此，通过这种方式，您可以根据使用 ngTranslate 的翻译选择占位符。

这取决于您的应用中是否实现了翻译，例如如果您的应用程序在更改语言时没有重新加载，那么您将不得不处理更多事情，例如，在更改语言时，您需要再次定义该选择的配置对象，并且您需要删除该元素并重新创建它在 DOM 中使用 ng-if 所以该 selectize 元素上几乎没有闪烁，但它会执行得很好。如果您的应用要在语言更改时重新加载，则不需要此逻辑实现。

Working Plunker Example