AngularJS联系表单返回“ TypeError:$ http.post(...)。成功不是函数”

时间:2018-12-06 20:37:02

标签: angularjs

在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>

1 个答案:

答案 0 :(得分:1)

AngularJS V1.6 起,这些方法已删除。相反,必须使用then(...)方法。

您可以在此question

中找到更多信息

您可以这样做:

$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){ ... })