Question

我试图用我的AngularJS控制器调用一个函数，代码如下：

控制器代码

(function () {

    var hello = angular.module("helloApp", []);

    hello.controller("HelloCtrl", ["$http", "$scope", function($scope, $http) {
        console.log("in controller");
        $scope.test = function() {
            console.log("in test function");
            $http.get("/test").success(function(data) {
                console.log("success");
            })
            .error(function(data) {
                console.log("error");
            });
        };
    } ]);

})();

HTML

<!DOCTYPE html>
<html ng-app="helloApp">
  <head>
    ...
  </head>
  <body ng-controller="HelloCtrl">
  <div class="container">
    <form class="form-horizontal">
      <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
          <button type="submit" class="btn btn-default" ng-click="test()">Search</button>
        </div>
      </div>
    </form>
  </div>
  ...
</body>

当我启动应用程序时，我会看到消息"in controller"，正如我所料。但是，如果我单击提交按钮，那么我看不到其他三个控制台消息。

我错过了什么？

Answer 1

你的依赖注入顺序是错误的。

hello.controller("HelloCtrl", ["$http", "$scope", function($scope, $http) {

应该是

 hello.controller("HelloCtrl", ["$http", "$scope", function($http, $scope) {

参数的顺序必须与名称数组的顺序相同。

AngularJS控制器中的函数未被调用

1 个答案: