angular.js - Angularjs+requirejs ngMessages校验问题
问题描述
问题描述:我使用requirejs+angularjs+ngMessages参照官方文档写了一个校验的DEMO,但是下图中$error的错误提示正确,但是<p ng-message='myForm.myName.$error' style='color:maroon'> <p ng-message='required'>You did not enter a field</p> <p ng-message='minlength'>Your field is too short</p> <p ng-message='maxlength'>Your field is too long</p></p> 中提三行错误提示文字,却一直显示。
可以帮助我看一下是哪里出现问题了吗?
代码:main.js:
requirejs.config({ paths: { ’angular’: ’//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min’,’app’: ’app’,’lodash’: ’https://cdn.jsdelivr.net/lodash/4.13.1/lodash.min’,’ngMessages’: ’//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-messages’ }, shim: {’angular’: { exports: ’angular’},’ngMessages’: [’angular’],’app’: [’angular’] }});require([’angular’,’ngMessages’, ’app’ ], function(angular){angular.element(document).ready(function(){ angular.bootstrap(document, [’myApp’]);}); })
index.html
<!DOCTYPE html><html><head></head><body> <script data-main='main' src='http://requirejs.org/docs/release/2.1.11/minified/require.js'></script> <p ng-controller='TooltipDemoCtrl'> <form name='myForm'> <label>Enter your name:<input type='text' name='myName' ng-model='name' ng-minlength='5' ng-maxlength='20' required /> </label> <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre> <p ng-message='myForm.myName.$error' style='color:maroon'><p ng-message='required'>You did not enter a field</p><p ng-message='minlength'>Your field is too short</p><p ng-message='maxlength'>Your field is too long</p> </p> </form> </p></body></html>
app.js
define([’require’, ’lodash’], function(require, _) { var angular = require(’angular’); angular.module(’myApp’, []).controller(’TooltipDemoCtrl’, function($scope) { })});
DEMO代码地址:http://plnkr.co/edit/AWVXcU8CWQTXFqu6pVtL?p=preview
问题解答
回答1:试试我这个:plunker
<p ng-controller='TooltipDemoCtrl'> <form name='myForm'> <label>Enter your name:<input type='text' name='myName' ng-model='name' ng-minlength='5' ng-maxlength='20' required /> </label> <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre> <p ng-messages='myForm.myName.$error' style='color:maroon'><p ng-message='required'>You did not enter a field</p><p ng-message='minlength'>Your field is too short</p><p ng-message='maxlength'>Your field is too long</p> </p> </form></p>
app.js
define([’lodash’, ’angular’], function( _, angular) { angular.module(’myApp’, [’ngMessages’]) .controller(’TooltipDemoCtrl’, function($scope) { });});
main
requirejs.config({ paths: { ’angular’: ’//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min’, ’app’: ’./app’, ’lodash’: ’https://cdn.jsdelivr.net/lodash/4.13.1/lodash.min’, ’ngMessages’: ’//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-messages.min’ }, shim: {angular: { exports: ’angular’}, ngMessages: [’angular’], app: [’ngMessages’] }});require([’angular’,’app’], function(angular, app){ angular.bootstrap(document, [’myApp’]);});
相关文章:
1. MYSQL新建用户设置可以远程访问的问题2. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法(标题说不太清楚,请见题内描述)3. java - mybatis怎么实现在数据库中有就修改,没有就添加4. $fields = $values = [];这条代码一直定义不了,一直报错,老师的源码也是被报错的,执行不了,请问该怎么解决这个问题5. node.js - nodejs和前端JavaScript 字符串处理结果不一样是什么原因?6. 各位谁知道这个CSS时候哪里出错了???7. mysql - 我的myeclipse一直连显示数据库连接失败,不知道为什么8. mysql 5.7单表300万数据,性能严重下降,如何破?9. mysql - SQL操作时间的函数?10. mysql 为何insert的时候会有lock wait timeout 异常
![$fields = $values = [];这条代码一直定义不了,一直报错,老师的源码也是被报错的,执行不了,请问该怎么解决这个问题](http://www.haobala.com/attached/image/news/202205/093622cb60.png)