0

这篇文章是一次角度自定义验证唯一电子邮件触发器的一个进步

所以使用旧帖子中的代码，我意识到字段电子邮件的值（当我发送到服务器时）是未定义的，所以我尝试了

<!doctype html>
<html data-ng-app="myApp">
    <head>
         <meta charset="utf-8">

    </head>
    <body>
        <div data-ng-controller="myCtrl">
            <form novalidate id="frm-signup" name="addContestantFrm" data-ng-submit="add()">
                <div>
                    <label for="email">Email: *</label>
                    <input type="email" id="email" name="email" class="input-medium" tabindex="3" title="email" maxlength="255" value="{{contestant.email}}" placeholder="email" data-ng-model="contestant.email" required email-unique />
                </div>
                <div>
                    <input type="submit" id="sbmt" name="sbmt" class="input-sbt" data-ng-disabled="!addContestantFrm.$valid" value="Send" />
                </div>
            </form>
        </div>
         <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.angularjs.org/1.0.8/angular.min.js"></script>
        <script>
            var app = angular.module('myApp', []);
            app.factory('Contestant',function($http){
                return {
                    checkUniqueEmail : function(email){
                        return $http.post('./checkemail.php',{email:email});
                    }
                }
            });
            app.controller('myCtrl',function($scope){
                $scope.add = function(){
                    console.log($scope.contestant);
                }
            });
            app.directive('emailUnique',function(Contestant) {
                return {
                    require: 'ngModel',
                    link: function(scope, element, attrs,ctrl) {
                        ctrl.$parsers.unshift(function(viewValue) {
                            console.log(ctrl.$error.email);
                            Contestant.checkUniqueEmail(viewValue).success(function (response) {
                                ctrl.$setValidity('emailUnique', true);
                                scope.$apply(function(scope) {
                                    ctrl.$setViewValue('email', viewValue);
                                });
                                return viewValue;
                            })
                            .error(function (data) {
                                ctrl.$setValidity('emailUnique', false);
                                console.log(viewValue);
                                return undefined;
                            });
                        });
                    }
                }
            });
        </script>
    </body>
</html>

给我 $digest 已经在进行中

那么如何设置电子邮件值发送到服务器（现在只有一个例子）

更新

我试过如果

(!scope.$$phase) {
  //never excuted
}
4

2 回答 2

1

我很确定会$http启动一个循环，$digest然后尝试启动另一个循环。您应该能够设置变量并看到它的反映，或者可能尝试返回所有的承诺.$applyscopescope.then

Contestant.checkUniqueEmail(viewValue).success(function (response) { //<- Digest started
    ctrl.$setValidity('emailUnique', true);
    /*
    scope.$apply(function(scope) { //<--Trying to start again
        ctrl.$setViewValue('email', viewValue);
    });
    */
    return viewValue;
})

使用.then

checkUniqueEmail : function(email){
    return $http.post('./checkemail.php',{email:email}).then(function(result) {
        return result.data;
    });
}

Contestant.checkUniqueEmail(viewValue).then(function (response) {
    //try stuff here now.
});
于 2013-09-26T13:11:49.673 回答
0

timeJV 是对的，问题出在 http post promise 处理上。必须用这个模式完成

var deferred=$q.defer() 
http.post(...).success(...).error(...);
return defered.promise

我在这里从您的代码创建了一个 jsfiddle并进行了一些修改以使其正常工作。

如果你需要别的东西，请告诉我

于 2014-09-03T21:05:40.253 回答