我是一个较新的角度用户,我试图对表单进行验证。我在这里找到了一个例子:http://plnkr.co/edit/gLDFaf?p=preview
这正是我想要的...所以我的问题:)我不明白为什么如果我添加"使用严格",验证(红色边框(不起作用;在脚本的顶部.js
"use strict"; // <-- validation doesn't work if removed
module = angular.module('app', []);
module.controller('NewUserController', function($scope) {
$scope.save = function() {
if ($scope.userForm.$valid) {
alert('User saved');
$scope.reset();
} else {
alert("There are invalid fields");
}
};
$scope.reset = function() {
$scope.user = { name: '', email: '' };
}
});
和观点:
<body ng-app="app" ng-controller="NewUserController">
<h1>Add New User</h1>
<form name="userForm" novalidate>
<div class="form-group" ng-class="{ 'has-error': userForm.name.$invalid }" >
<label class="control-label">Name</label>
<input type="text" class="form-control" name="name" ng-model="user.name" required placeholder="Name" />
</div>
<div class="form-group" ng-class="{ 'has-error': userForm.email.$invalid }" >
<label class="control-label">Email</label>
<input type="email" class="form-control" name="email" ng-model="user.email" required placeholder="Email" />
</div>
<button class="btn btn-primary" ng-click="save()">Add User</button>
<button class="btn btn-link" ng-click="reset()">Reset</button>
</form>
</body>
有人可以解释一下吗?
如果你看一下浏览器的控制台,你会发现JS代码实际上崩溃了,因此你的JS代码都没有活动;所以没有Angular验证,表单只是以标准的HTML行为提交自己。
JS崩溃的原因是您无法在严格模式下创建全局变量。声明module
变量时没有 var
语句,这通常会使其成为全局变量。添加 var
语句可使代码正常工作。
"use strict";
var module = angular.module('app', []); // The variable is properly defined
您可以在此处找到更多信息:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode#Converting_mistakes_into_errors
开头添加
varvar app = angular.module('app', []);
app.controller('NewUserController', function($scope) {
检查更新的普伦克