当密码在 Angularjs 中不匹配时如何显示错误消息?



我是AngularJS的新手,我的问题是当密码与确认密码匹配时如何显示错误消息?有人可以帮助我吗,这不是很困难,但我仍在学习编程。谢谢大家!我有html代码:

<form ng-submit="saveItem(userForm.$valid)" name="userForm">
    <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <label for="database_address">User</label>
                <input type="text" class="form-control" required ng-model="activeItem.username" placeholder="Потребителско Име..." />
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                <input type="text" class="form-control" id="password" ng-model="activeItem.passwordString"  />
            </div>
            <div class="form-group">
                <label for="password">Confirm Password</label>
                <input type="text" class="form-control" id="password" ng-model="activeItem.passwordConfirm"  />
            </div>
              <p ng-show="(userForm.passwordConfirm != '') && (userForm.password != userForm.passwordConfirm)">Passwords don't match</p>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label for="username">Operator</label>
                <input type="text" class="form-control" required id="username" ng-model="activeItem.name" />
            </div>
        </div>
    </div>
    <button class="btn btn-primary" ng-disabled="userForm.$invalid" type="submit">Save</button>
    <!--<button class="btn btn-primary" ng-disabled="userForm.$invalid" type="submit">Добавяне на нов</button>-->
</form>

和角函数:

$scope.saveItem = function(){
        console.log($scope.activeItem);
        //delete $scope.activeItem.hash_method
        var objectToSave = {
            username: $scope.activeItem.username,
            //password: $scope.activeItem.password,
            name: $scope.activeItem.name,
            id: $scope.activeItem.id
        };
        if($scope.activeItem.passwordString != ''){
            if($scope.activeItem.passwordString == $scope.activeItem.passwordConfirm){
                objectToSave.password = $scope.activeItem.passwordString;
            } else {
                    console.log('Confirm password error');
            }
        }

您将需要保留两个密码字段的不同ID,也请查看您的模型绑定:

<input type="text" class="form-control" id="password" ng-model="activeItem.passwordString" />

<input type="text" class="form-control" id="passwordConfirm" ng-model="activeItem.passwordConfirm" />

您只能在ng-if/ng-show中引用与ng模型绑定的项目,然后您不需要在后端上进行任何自定义逻辑。

<p ng-show="(activeItem.passwordString && activeItem.passwordConfirm) && activeItem.passwordString !== activeItem.passwordConfirm ">Passwords don't match</p>

另外,您可能想使用'!=='over'!=',因为您只是在比较两个字符串,因为它更严格。

编辑:要注意的一件事,使用此方向,您仍然可能想在保存功能中检查错误,但这应该处理出现错误消息而没有任何问题。

请记住'not core'is'的操作员是"!==",您将能够做到!

相关内容

最新更新