无法从范围内调用另一个函数onSubmit函数

时间:2015-08-19 20:37:21

标签: angularjs dependency-injection angularjs-controller

我有一个非常简单的表单模板和控制器。但是我无法在onSubmit范围函数中调用函数。控制器是:

angular
    .module('myApp')
    .controller('registerUserCtrl', registerUserCtrl);


    function registerUserCtrl($scope, $location, $window, authenticationService, $http, vcRecaptchaService){


        $scope.pageHeader = {
            title: 'Register',
        };


        $scope.register = function (data) {

            console.log('in scope.register ');

                userService.register(data)
                    .success(function(data) {

                        console.log('setting to true.....');

                        authenticationService.isLoggedIn = true;
                        authenticationService.user = data.user;
                        authenticationService.token = data.token;

                        $location.path("/");
                    }).error(function(status, data) {
                        console.log(status);
                        console.log(data);
                        $scope.formError = "This email has already been taken";
                    });

        }


        $scope.onSubmit = function () {

            console.log('in onSubmit');

            //N.B. Need to veriify this
            var response = vcRecaptchaService.getResponse();

            $scope.formError = "";

            if(!$scope.formData || !$scope.formData.email || !$scope.formData.password) {
                $scope.formError = "All fields required, please try again";
                return false;
            } else {

                console.log('$scope is ');
                console.log($scope);
                $scope.register($scope.formData);           
            }       

        };



    }   

模板是:

<div id="register-wrapper">
    <form class="form-horizontal" role="form"  ng-submit="onSubmit()">
        <div role="alert" ng-show="formError" class="alert alert-danger">{{ formError }}</div>


        <div class="form-group">
            <label for="inputEmail" class="col-sm-4 control-label">Email</label>
            <div class="col-sm-4">
                <input type="email" class="form-control" id="inputEmail" placeholder="Email" ng-model="formData.email">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword" class="col-sm-4 control-label">Password</label>
            <div class="col-sm-4">
                <input type="password" class="form-control" id="inputPassword" placeholder="Password" ng-model="formData.password">
            </div>
        </div>

        <div vc-recaptcha key="'6Lf6aQsTAAAAAACdCxN2FqHHKpz0RyF9jMJsn6h4'"></div>


        <div class="form-group">
            <div class="col-sm-offset-4 col-sm-10">
                <button type="submit" class="btn btn-default">Register</button>
            </div>
        </div>
    </form>
</div>

我总是最终:

undefined is not a function

$scope.register($scope.formData);行。我之前已多次这样做过,但不知怎的现在它还没有用......

1 个答案:

答案 0 :(得分:1)

您需要在控制器中注入userSevice作为依赖

angular
    .module('myApp')
    .controller('registerUserCtrl', registerUserCtrl);


    function registerUserCtrl($scope, $location, $window, authenticationService, 
         $http, vcRecaptchaService, userSevice)
    {