javascript - 类型错误 : Cannot read property 'post' of undefined

Question

我收到以下错误:

TypeError: Cannot read property 'post' of undefined
    at postName (http://127.0.0.1:9000/scripts/controllers/main.js:28:12)
    at Scope.$scope.submit (http://127.0.0.1:9000/scripts/controllers/main.js:10:7)
    at http://127.0.0.1:9000/bower_components/angular/angular.js:10348:21
    at http://127.0.0.1:9000/bower_components/angular/angular.js:18333:17
    at Scope.$eval (http://127.0.0.1:9000/bower_components/angular/angular.js:12175:28)
    at Scope.$apply (http://127.0.0.1:9000/bower_components/angular/angular.js:12273:23)
    at Scope.$delegate.__proto__.$apply (<anonymous>:855:30)
    at HTMLFormElement.<anonymous> (http://127.0.0.1:9000/bower_components/angular/angular.js:18332:21)
    at HTMLFormElement.jQuery.event.dispatch (http://127.0.0.1:9000/bower_components/jquery/dist/jquery.js:4641:9)
    at HTMLFormElement.elemData.handle (http://127.0.0.1:9000/bower_components/jquery/dist/jquery.js:4309:46) angular.js:9563(anonymous function) angular.js:9563(anonymous function) angular.js:7004Scope.$apply angular.js:12275$delegate.__proto__.$apply VM1976:855(anonymous function) angular.js:18332jQuery.event.dispatch jquery.js:4641elemData.handle

我的 main.js 文件:

'使用严格';

angular.module('sayHiApp')
  .controller('MainCtrl', function ($scope) {

    // Accepts form input
    $scope.submit = function() {

      // POSTS data to webservice
      postName($scope.input);

      // GET data from webservice
      var name = getName();

      // DEBUG: Construct greeting
      $scope.greeting = 'Sup ' + name + ' !';

    };

    function postName ($scope, $http, dataToPost) {

      $http.post('/name', dataToPost).
      success(function(data) {
        $scope.error = false;
        $scope.data = data;
      }).
      error(function(data) {
        $scope.error = true;
        $scope.data = data;
      });
    }

    // GET name from webservice
    function getName ($scope, $http) {

      $http.get('/name').
      success(function(data) {
        $scope.error = false;
        $scope.data = data;

        return data;
      }).
      error(function(data) {
        $scope.error = true;
        $scope.data = data;

        return 'error name';
      });

    }

  });

我不确定这个错误指的是什么？如果它指的是“$http”上的“post”方法，那么我会很困惑。提前感谢您的帮助:)

Answer 1

这指的是您建议的“$http”上的“post”方法。

您需要在 Controller 函数中添加 $http 作为参数，以便 Angular 会注入(inject)它(就像您对 $scope 所做的那样)。

我对您的代码进行了另一项更改，从内部函数中删除了 $scope 和 $http 参数，因为由于闭包，它们在函数中是已知的。

angular.module('sayHiApp')
  .controller('MainCtrl', function ($scope, $http) {

// Accepts form input
$scope.submit = function() {

  // POSTS data to webservice
  postName($scope.input);

  // GET data from webservice
  var name = getName();

  // DEBUG: Construct greeting
  $scope.greeting = 'Sup ' + name + ' !';

};

function postName (dataToPost) {

  $http.post('/name', dataToPost).
  success(function(data) {
    $scope.error = false;
    $scope.data = data;
  }).
  error(function(data) {
    $scope.error = true;
    $scope.data = data;
  });
}

// GET name from webservice
function getName () {

  $http.get('/name').
  success(function(data) {
    $scope.error = false;
    $scope.data = data;

    return data;
  }).
  error(function(data) {
    $scope.error = true;
    $scope.data = data;

    return 'error name';
  });
}
});