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 に答える