0

我有这样的表格

<div ng-controller="controllerPasswordChange">
<form name="form" novalidate>
        <div >
            <label class="control-label screen-reader-text" for="email">Email</label>
            <div>
                <input ng-model="formModel.email" type="email" name="email" class="large-field" id="email" placeholder="Email" required>
                <div class="input-help">
                    <h4>Invalid Email</h4>
                </div>
            </div>
        </div>

        <div>
            <label class="control-label screen-reader-text" for="password">Password</label>
            <div class="controls relative mrl">
                <input name="password" id="password" ng-model="formModel.password" ng-change="checkPasswordCriteria()" required class="immediate-help large-field" type="password" placeholder="Enter new password">
            </div>
        </div>
</form>

当密码输入改变时, checkPasswordCriteria 方法被调用如下

var checkingPasswordCriteria =  false;
var checkPasswordCriteriaSuccess = function()
{
    console.log("checking password criteria success");
    checkingPasswordCriteria = false;
    // HERE I WANT TO CHANGE THE VALIDITY OF THE PASSWORD FIELD TO TRUE
};

var checkPasswordCriteriaError = function()
{
    console.log("checking password criteria error");
    checkingPasswordCriteria = false;
    // HERE I WANT TO CHANGE THE VALIDITY OF THE PASSWORD FIELD TO FALSE
};

$scope.checkPasswordCriteria = function()
{
    if( !checkingPasswordCriteria )
    {
        checkingPasswordCriteria = true;
        ajaxService.checkPasswordCriteria($scope.formModel.email,$scope.formModel.password,
            checkPasswordCriteriaSuccess, checkPasswordCriteriaError);
    }
};

我想根据收到的 http 结果代码更改控制器中密码输入字段的有效性。我已经看到了使用指令更改有效性的方法,但在我的情况下,感觉有点矫枉过正+只是为了知道如何做到这一点而知道......

干杯,泽维尔

[编辑]
我必须添加我希望在输入字段中更改用户类型而不是在焦点更改时更改有效性。
[/编辑]

4

1 回答 1

-2

将表单的密码控件传递给 checkPasswordCriteria 并在该函数内部修改它就可以了:

<div>
    <label class="control-label screen-reader-text" for="password">Password</label>
    <div class="controls relative mrl">
        <input name="password" id="password" ng-model="formModel.password" ng-change="checkPasswordCriteria(form.password)" required class="immediate-help large-field" type="password" placeholder="Enter new password">
    </div>
</div>

在 checkPasswordCriteria 中,只需根据响应设置控件的有效性:

$scope.checkPasswordCriteria = function (passwordControl) {
    if (!checkingPasswordCriteria) {
        checkingPasswordCriteria = true;

        // Simulating a service call and response
        $timeout(function() {
            passwordControl.$setValidity('valid', Math.random() >= 0.5);
            checkingPasswordCriteria = false;                
        }, 1000);
    }
};

演示小提琴:

http://jsfiddle.net/UHBAu/

于 2013-07-19T03:44:00.473 回答