Question

我是Angular的新手。在项目中实现本地化。我有很多输入，我必须翻译占位符。在HTML中我有这样的东西

<input  type="email" placeholder="{{ 'TRANSLATION_KEY' | translate }}" onfocus="this.placeholder=''" onblur="this.placeholder='{{ 'TRANSLATION_KEY' | translate }}'" required>

但是这部分代码不起作用：（

onblur="this.placeholder='{{ 'TRANSLATION_KEY' | translate }}'"

如何将翻译后的值设置为占位符onblur？我会感激任何帮助！

Answer 1

这是解决问题的好方法JSFiddle：

HTML：

<div ng-app="myApp" ng-controller="myCtrl">
    <input  type="email" placeholder="{{placeholder}}" ng-focus="setPlaceholder()" ng-blur="setPlaceholder('TRANSLATION_KEY')" required>
</div>

JS：

angular.module('myApp', [])
.controller('myCtrl', function ($scope, $filter) {
    $scope.placeholder = $filter('translate')('TRANSLATION_KEY');

    $scope.setPlaceholder = function (data) {
        $scope.placeholder = $filter('translate')(data);
    };
})
.filter('translate', function () {
    return function (data) {
        return data;
    };
});

Answer 2

我有另一个解决方案。更普遍，更容易。只需将此行添加到视图中的输入

即可

*:not(.classname){
  box-sizing : border-box;
}

使用angular-translate设置占位符值onblur

2 个答案: