Question

我很难让AngularJS认出我的PHPMailer发送正确。它根据控制台返回成功json，但它没有在我的页面上填充正确的类，这使我相信正在调用.success函数，但由于某种原因它被调用。触发else语句。我在控制器中设置了呼叫设置，如下所示：

  .controller('ContactCtrl', function ($scope, $http) {
    $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) {
        $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';
                } else {
                    $scope.submitButtonDisabled = false;
                    $scope.resultMessage = data.message;
                    $scope.result='bg-danger';
                }
            });
        } else {
            $scope.submitButtonDisabled = false;
            $scope.resultMessage = 'Failed.';
            $scope.result='bg-danger';
        }
    }
});

每当我查看控制台时，我发现我的PHP脚本正在返回JSON，表明它有效（它记录在.success下）。但是当我在我的标记中使用ng-binding类时，它触发了else语句中声明的类，并且它没有用该消息填充页面。

{"success":true,"message":"Thanks! We have received your message."}


<div ng-controller="ContactCtrl" class="panel-body ng-scope">
    <form ng-submit="submit(contactform)" name="contactform" class="form-horizontal ng-pristine ng-invalid ng-invalid-required" role="form">
        <div class="form-group" ng-class="{ 'has-error': contactform.inputName.$invalid &amp;&amp; submitted }">
            <label for="inputName" class="col-lg-2 control-label">Name</label>
            <div class="col-lg-10">
                <input ng-model="formData.inputName" type="text" class="form-control ng-pristine ng-invalid ng-invalid-required" id="inputName" name="inputName" placeholder="Your Name" required="">
            </div>
        </div>
        <div class="form-group" ng-class="{ 'has-error': contactform.inputEmail.$invalid &amp;&amp; submitted }">
            <label for="inputEmail" class="col-lg-2 control-label">Email</label>
            <div class="col-lg-10">
                <input ng-model="formData.inputEmail" type="email" class="form-control ng-pristine ng-invalid ng-invalid-required ng-valid-email" id="inputEmail" name="inputEmail" placeholder="Your Email" required="">
            </div>
        </div>
        <div class="form-group" ng-class="{ 'has-error': contactform.inputSubject.$invalid &amp;&amp; submitted }">
            <label for="inputSubject" class="col-lg-2 control-label">Subject</label>
            <div class="col-lg-10">
                <input ng-model="formData.inputSubject" type="text" class="form-control ng-pristine ng-invalid ng-invalid-required" id="inputSubject" name="inputSubject" placeholder="Subject Message" required="">
            </div>
        </div>
        <div class="form-group" ng-class="{ 'has-error': contactform.inputMessage.$invalid &amp;&amp; submitted }">
            <label for="inputMessage" class="col-lg-2 control-label">Message</label>
            <div class="col-lg-10">
                <textarea ng-model="formData.inputMessage" class="form-control ng-pristine ng-invalid ng-invalid-required" rows="4" id="inputMessage" name="inputMessage" placeholder="Your message..." required=""></textarea>
            </div>
        </div>
        <div class="form-group">
            <div class="col-lg-offset-2 col-lg-10">
                <button type="submit" class="btn btn-default" ng-disabled="submitButtonDisabled">
                    Send Message
                </button>
            </div>
        </div>
    </form>
    <p ng-class="result" style="padding: 15px; margin: 0;" class="ng-binding hidden"></p>
</div>

任何建议都会有所帮助。

AngularJS无法识别PHPMailer中的JSON

0 个答案: