时间戳

首页 > 解决方案 > AngularJS 联系表单返回“TypeError: $http.post(...).success 不是函数”

angularjs - AngularJS 联系表单返回“TypeError: $http.post(...).success 不是函数”

问题描述

在我的 AngularJS 应用程序中，我构建了一个联系表单，但是当我尝试发送电子邮件时，我收到以下错误

TypeError: $http.post(...).success is not a function

不确定这是 AngularJS 问题还是错误代码。

我在网上搜索了一下，大多数人都有同样的问题，得到了以下答案

没有 $.post().success 方法了

我该怎么做才能使用我的代码发送电子邮件？

我的控制器

app.controller("formCtrl", ['$scope', '$http', function ($scope, $http) {
        $scope.url = 'app/form/mailer.php';
        $scope.formsubmit = function (isValid) {

            if (isValid) {

                $http.post($scope.url, {"name": $scope.name, "email": $scope.email, "phone": $scope.phone}).
                        success(function (data, status) {
                            $scope.status = status;
                            $scope.data = data;
                            $scope.result = data; // Show result from server in our <pre></pre> element
                        })
            } else {
                alert('Form is not valid');
            }

        }

    }]);

我的邮件

    <?php

$post_data = file_get_contents("php://input");
$data = json_decode($post_data);

//Just to display the form values
echo "Name : " . $data->name;
echo "Email : " . $data->email;
echo "phone : " . $data->phone;

// sned an email
$to = $data->email;

$subject = 'Test email from phpcodify.com to test angularjs contact form';

$message = $data->phone;

$headers = 'From: ' . $data->name . 'info@rapio.nl' . "\r\n" .
        'Reply-To: info@rapio.nl' . "\r\n" .
        'X-Mailer: PHP/' . phpversion();

//php mail function to send email on your email address
mail($to, $subject, $message, $headers);

?>

形式

<form  name="userForm"  class="well form-search"   >
        <br/>
        <md-content class="md-no-momentum">
          <md-input-container class="md-icon-float md-block">
            <!-- Use floating label instead of placeholder -->
            <label>Name</label>
            <md-icon md-svg-src="img/icons/ic_person_24px.svg" class="name"></md-icon>
            <input type="name" ng-model="name" class="form-control" id="name" required>
          </md-input-container>

          <md-input-container class="md-icon-float md-block">
            <md-icon md-svg-src="img/icons/ic_phone_24px.svg" class="phone"></md-icon>
            <input type="number" ng-model="phone" class="form-control" id="phone" required>
          </md-input-container>

          <md-input-container class="md-block">
            <!-- Use floating placeholder instead of label -->
            <md-icon md-svg-src="img/icons/ic_email_24px.svg" class="email"></md-icon>
            <input type="mail" ng-model="email" class="form-control" id="email" required>
          </md-input-container>
           <div>
              <md-button id="button" type="submit" ng-click="formsubmit(userForm.$valid)"  ng-disabled="userForm.$invalid"
               style="
                font-size: 24px;
                background-color: white;
                width: 100%;
                color: #de146d !important;">
                  Aanmelden
                </md-button>
            </div>

        </md-content>
      </form>

标签： angularjs

解决方案

从AngularJS V1.6开始，这些方法已被删除。而是必须使用then(...)方法。

您可以在这个问题中找到更多信息

你可以这样做：

$http
.post($scope.url, {"name": $scope.name, "email": $scope.email, "phone": $scope.phone})
    .then(function (response)
        $scope.status = response.status;
        $scope.data = response.data;
        $scope.result = response.data; // Show result from server in our <pre></pre> element
    }, function (error){ ... })

推荐阅读