AngularJs ng-messages有多种语言版本

时间:2015-09-01 13:46:40

标签: javascript angularjs

我正在使用ng-messages向表单验证显示错误消息。 我的应用是多语言的,如何在多语言中使用ng-messages

html表单

<div class="messages" ng-messages="myForm.email.$error">
    <div ng-messages-include="messages.html"></div>
</div>

messages.html

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<p ng-message="required">This field is required</p>
<p ng-message="minlength">This field is too short</p>
<p ng-message="maxlength">This field is too long</p>
<p ng-message="required">This field is required</p>
<p ng-message="email">This needs to be a valid email</p>

P.S。:我正在使用棱角1.4.6

2 个答案:

答案 0 :(得分:0)

一种快速(较长时间内可维护性较低)的方法是每种语言都有不同的js文件(italian.js,english.js ..) 1)根据语言和索引引用相应的locale js文件,有多个索引页面 2)在语言选择上更改索引页面..sp自动语言环境引用将更改

使用{{requiredMessage}}

替换“此字段是必填项” locale-english.js中的

controllersModule.controller('HeaderLocale', ['$scope', function($scope) {
    $scope.requiredMessage='This field is required';
}
在locale-italian.js中

controllersModule.controller('HeaderLocale', ['$scope', function($scope) {
    $scope.requiredMessage='This field is required message in italian';
}

答案 1 :(得分:0)

太晚了。但它可能会帮助别人。我想知道同样的事情。经过一些研究后,我选择了angular translate库帮助我翻译所有视图标签,服务器端消息和前端验证。

<p ng-message="required" translate="">required_msg </p>
<p ng-message="minlength" translate="">too_short_msg</p>
<p ng-message="maxlength" translate="">too_long_msg</p>
<p ng-message="email" translate="">invalid_email_msg</p>
<p ng-message="pattern" translate="">invalid_characters_msg</p>

将键和值放在语言环境文件中,以获取所需的所有语言  例如:locale-en.js

  "required_msg" : "This field is required" ,
  "too_short_msg" : "This field is too short",
  "too_long_msg" : "This field is too long",
  "invalid_email_msg" : "Enter valid email",
  "invalid_characters_msg" : "Invalid Characters"