Question

我在ng-switch中有一个电子邮件表单。每当我点击发送控制台都会出错。只有在我将ng-switch添加到表单时才会出现错误。不知道为什么它是一个jquery错误。

控制台错误

TypeError: Cannot read property 'jquery' of undefined
at Function.n.param (jquery.min.js:4)
at n.$scope.submit (contactController.js:20)
at angular.min.js:199
at f (angular.min.js:216)
at n.$eval (angular.min.js:126)
at n.$apply (angular.min.js:126)
at HTMLFormElement.<anonymous> (angular.min.js:216)
at HTMLFormElement.n.event.dispatch (jquery.min.js:3)
at HTMLFormElement.r.handle (jquery.min.js:3)

contact.html

<div class="container" ng-switch on="contactsent">
    <div class="contact col-xs-12" ng-switch-when="default">
        <form ng-submit="submit(contactform, $event)" name="contactform" method="post" action="" role="form">
            form inputs button etc..
        </form>
    </div>

    <div class="contact-sent col-xs-12 center" ng-switch-when="success">
        <h2 class="contact-sent-message">You message has been succesfully sent!</h2>
        <a class="contact-sent-back" href="/#/home">Click here to go back</a>
    </div>
</div>

控制器文件

MyApp.controller('contactController', function ($scope, $http) {

    $scope.contactsent = 'default';

    $scope.result = 'hidden'
    $scope.resultMessage;
    $scope.formData; //formData is an object holding the name, email, subject, and message
    $scope.submitButtonDisabled = false;
    $scope.submitted = false; //used so that form errors are shown only after the form has been submitted
    $scope.submit = function(contactform, e) {

        e.preventDefault();

        $scope.submitted = true;
        $scope.submitButtonDisabled = true;
        if (contactform.$valid) {
            $http({
                method  : 'POST',
                url     : 'contact-form.php',
                data    : $.param($scope.formData),  //param method from jQuery
                headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  //set the headers so angular passing info as form data (not request payload)
            }).success(function(data){
                console.log(data);
                if (data.success) { //success comes from the return json object
                    $scope.submitButtonDisabled = true;
                    $scope.resultMessage = data.message;
                    $scope.result='bg-success';
                    $scope.contactsent = 'success';

                } else {
                    $scope.submitButtonDisabled = false;
                    $scope.resultMessage = data.message;
                    $scope.result='bg-danger';
                }
            });
        } else {
            $scope.submitButtonDisabled = false;
            $scope.resultMessage = 'Failed <img src="http://www.chaosm.net/blog/wp-includes/images/smilies/icon_sad.gif" alt=":(" class="wp-smiley">  Please fill out all the fields.';
            $scope.result='bg-danger';
        }
    }
});

Answer 1

编辑：

问题在于这一行，$scope.formData未定义，而它必须是对象或数组

  data    : $.param($scope.formData),  //param method from jQuery

Answer 2

看起来你的问题在之前被问到并解决了：

https://www.google.com/search?q=angular+js+"Cannot+read+property+jquery+of+undefined"

ng switch内的电子邮件表单出错

2 个答案: