在 Angular 中确认密码错误消息

Confirm password error message in Angular

我正在尝试创建一个简单的密码确认,看起来像这样

<div class="form-group">
        <label class="col-sm-2 control-label" for="password">Password:</label>
        <div class="col-sm-10">
            <input type="password" class="form-control" id="password" placeholder="Password" data-ng-model="myApp.password" required >
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label" for="confirmPassword">Confirm password:</label>
        <div class="col-sm-10">
            <input type="password" class="form-control" id="confirmPassword" placeholder="Confirm password" data-ng-model="confirmPassword" required pw-check="password">
            <p class="msg-error" ng-show="create_player_form.confirmPassword.$error.pwmatch">
                Passwords don't match.
            </p>
        </div>
    </div>

此 HTML 文件链接到如下定义的控制器:

angular.module('myApp')
    .controller('MyController', function ($scope, $state, $stateParams) {
(All the staff...)
}

我使用这样的指令:

.directive('pwCheck', [function () {
            return {
                scope: {pwmatch: '='},
                require: 'ngModel',
                link: function (scope, elem, attrs, ctrl) {
                    var firstPassword = '#' + attrs.pwCheck;
                    elem.add(firstPassword).on('keyup', function () {
                        scope.$apply(function () {
                            var v = elem.val() === $(firstPassword).val();
                            ctrl.$setValidity("pwmatch", v);
                        });
                    });
                }
            }
        }]);

一切正常,除了确认输入下的小错误消息。谁能帮我让它出现?

我公开地说,我正在使用:http://blog.brunoscopelliti.com/angularjs-directive-to-check-that-passwords-match/ 我看到,控制器以不同的方式定义,但我想在不改变现有结构的情况下简单地实现它。

 <div class="form-group">
    <label class="col-sm-2 control-label" for="password">Password:    </label>
    <div class="col-sm-10">
        <input type="password" class="form-control" id="password" placeholder="Password" data-ng-model="myApp.password" required >
    </div>
</div>
<div class="form-group">
    <label class="col-sm-2 control-label" for="confirmPassword">Confirm password:</label>
    <div class="col-sm-10">
        <input type="password" name="confirmPassword" class="form-control" id="confirmPassword" placeholder="Confirm password" data-ng-model="confirmPassword" required pw-check="password">
        <p class="msg-error" ng-show="create_player_form.confirmPassword.$error.pwmatch">
            Passwords don't match.
        </p>
    </div>
</div>

在输入名称中添加名称标签="confirmPassword" 然后尝试。您的表单名称也将是 "create_player_form"