我正在尝试验证并在服务器端显示消息。我能够显示某些属性的消息。但对于嵌套属性,我正在努力。在这里,我可以验证并显示电子邮件的消息,但不会针对username
和password
进行验证。 Username
和password
位于credential
模型中,这是用户模型的属性。
<form name="form" ng-submit="rgCtrl.register()" role="form" method="post">
<div class="form-group" ng-class="{ 'has-error': form.email.$dirty && form.email.$error.required }">
<label for="email">Email</label>
<input type="text" name="email" id="email" class="form-control" ng-model="rgCtrl.user.email" required server-error /> <span ng-show="form.email.$dirty && form.email.$error.required" class="help-block">Email is required</span> <span class="errors" ng-show="form.email.$dirty && form.email.$invalid"> <span ng-show="form.email.$error.server">{{errors.email}}</span>
</span>
</div>
<div class="form-group" ng-class="{ 'has-error': form.username.$dirty && form.username.$error.required }">
<label for="credential.username">Username</label>
<input type="text" name="credential.username" class="form-control" ng-model="rgCtrl.user.credential.username" required server-error /> <span ng-show="form.username.$dirty && form.username.$error.required" class="help-block">Username is
required</span> <span class="errors" ng-show="form.credential.username.$dirty && form.credential.username.$invalid">
<span ng-show="form.credential.username.$error.server">{{errors.credential.username}}</span>
</span>
</div>
<div class="form-group" ng-class="{ 'has-error': form.password.$dirty && form.password.$error.required }">
<label for="credential.password">Password</label>
<input type="password" name="credential.password" id="password" class="form-control" ng-model="rgCtrl.user.credential.password" required server-error /> <span ng-show="form.password.$dirty && form.password.$error.required" class="help-block">Password is
required</span> <span class="errors" ng-show="form.credential.password.$dirty && form.credential.password.$invalid">
<span ng-show="form.credential.password.$error.server">{{errors.credential.password}}</span>
</span>
</div>
.
.
.
</form>
注册方法:
function register() {
UserSvc.Create(vm.user).then(function (response) {
if (response.success) {
$location.path('/login');
} else {
angular.forEach(response.errors, function(errors, field) {
$scope.form[field].$setValidity('server', false);
$scope.errors[field] = errors;
});
}
});
}
服务器错误指令:
angular.module('app').directive('serverError', function() {
return {
restrict : 'A',
require : '?ngModel',
link : function(scope, element, attrs, ctrl) {
element.on('change', function() {
return scope.$apply(function() {
return ctrl.$setValidity('server', true);
});
});
}
}
});
有什么建议吗?我不知道它有什么问题。