初始化AngularJS控制器成员

Question

我尝试创建一个html / angularjs表单，将数据提交到我的网络服务器。页面正在加载控制器，因为它确实执行了提交功能。我在引用"ReferenceError: formData is not defined"数据时收到formData错误。我认为这是初始化控制器成员的正确方法。

var app = angular.module('messagingForm', []);
app.controller('messagingController', function($scope, $http) {
  $scope.formData = {
    userName: "bob",
    email: "bob@bob.com",
    subject: "why",
    message: "why not?"
  };

  $scope.submitted = false; //used so that form errors are shown only after the form has been submitted
  $scope.submit = function(sendContact) {
    $scope.submitted = true;

    console.log('validating data');
    if (sendContact.$valid) {
      console.log('sending data');
      $http({
        method: 'post',
        url: 'email.php',
        data: {
          'name': formData.userName,
          'email': formData.email,
          'subject': formData.subject,
          'message': formData.message
        },
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded'
        } //set the headers so angular passing info as form data (not request payload)
      }).success(function(data) {

      });
    } else {

      console.log('validating not good');
      alert('failed');
    }
  }
});

我不清楚我是如何初始化成员变量的。这样做的正确方法是什么？

太

Answer 1

试试这个：

变化：

data: {
       'name': formData.userName,
       'email': formData.email,
       'subject': formData.subject,
       'message': formData.message
    },

到

data: {
   'name': $scope.formData.userName,
   'email': $scope.formData.email,
   'subject': $scope.formData.subject,
   'message': $scope.formData.message
},

，然后：

var app = angular.module('messagingForm', []);
app.controller('messagingController', function($scope, $http) {
  $scope.formData = {
    userName: "bob",
    email: "bob@bob.com",
    subject: "why",
    message: "why not?"
  };

  $scope.submitted = false; //used so that form errors are shown only after the form has been submitted
  $scope.submit = function(sendContact) {
    $scope.submitted = true;

    console.log('validating data');
    if (sendContact.$valid) {
      console.log('sending data');
      $http({
        method: 'post',
        url: 'email.php',
        data: {
          'name': $scope.formData.userName,
          'email': $scope.formData.email,
          'subject': $scope.formData.subject,
          'message': $scope.formData.message
        },
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded'
        } //set the headers so angular passing info as form data (not request payload)
      }).success(function(data) {

      });
    } else {

      console.log('validating not good');
      alert('failed');
    }
  }
});

因为在你的代码中，«formaData»它在上下文中不存在。您可以尝试声明一个局部变量，如下所示：

var formData = {
    userName: "bob",
    email: "bob@bob.com",
    subject: "why",
    message: "why not?"
};

示例：

var app = angular.module('messagingForm', []);
app.controller('messagingController', function ($scope, $http) {
    var formData = {
        userName: "bob",
        email: "bob@bob.com",
        subject: "why",
        message: "why not?"
    };

    $scope.submitted = false; //used so that form errors are shown only after the form has been submitted
    $scope.submit = function(sendContact) {
        $scope.submitted = true;

        console.log('validating data');
        if (sendContact.$valid) {
            console.log('sending data');
            $http({
                method  : 'post',
                url     : 'email.php',
                data : {
                    'name': formData.userName,
                    'email': formData.email,
                    'subject': formData.subject,
                    'message': formData.message
                },
                headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  //set the headers so angular passing info as form data (not request payload)
            }).success(function(data){

            });
        } else {

            console.log('validating not good');
            alert('failed');
        }
    }
});

Answer 2

您还可以将(defn interop-compare [this a b c d e f] (do-array-compare)) (defn interop-compare-Object-Object [this a b] (do-object-compare)) (defn interop-compare-WritableComparable-WritableComparable [this a b] (do-writable-comparable-thing)) 对象创建为常量，然后将其显式传递给控制器​​。

formData

其他人在这里编码...

它使它更清晰，更容易测试。