Question

我似乎在使用服务时遇到问题。我创建了一个控制器文件并在其上面添加了一个服务。我将服务注入控制器，并尝试访问服务的其中一个功能。我正在使用按钮调用该函数。问题是当我按下按钮时没有任何反应。我已经尝试通过输出到控制台测试结果，但没有任何工作。

以下是一些控制器，其余部分与示例无关。

var app = angular.module('DonationWebApp');

app.service('candidateId', function() {
    var candidateID = 0;

    var addID = function(id){
        candidateID = id;
    };

    var getID = function() {
        return candidateID;
    };

    return {
        addID : addID,
        getID : getID
    }

});


app.controller('candidatesController', ['$scope','$location', '$http', function($scope, $location, $http, candidateId) {
    // create a message to display in our view
    $scope.message = 'Here are all the candidates';


    findAll();
    findSupporters();
    var display = true;
    var isHidden = true;

    $scope.addCandidateID = function(id) {
        candidateId.addID(id);
    }
}]);

这是按钮

<button type="button" class="btn btn-default" ng-click="addCandidateID(candidate._id)">
    <span class="glyphicon glyphicon-remove"></span> Edit
</button>

Answer 1

你必须先改变两件事：

您需要在应用定义后添加[]，因此它将是：

var app = angular.module('DonationWebApp', []);

您需要在控制器定义中的依赖项数组中包含candidateId：

app.controller('candidatesController', ['$scope','$location', '$http', 'candidateId', function($scope, $location, $http, candidateId) {
  ...
}]);

以下是plnkr

的示例

Answer 2

   var app = angular.module('DonationWebApp',[]);
   app.service('candidateId', function() {
    var candidateID = 0;

    var addID = function(id){
        candidateID = id;
    };

    var getID = function() {
        return candidateID;
    };

    return {
        addID : addID,
        getID : getID
    }

  });

          app.controller('candidatesController',  function($scope, $location,    $http, candidateId) {
            // create a message to display in our view
         $scope.message = 'Here are all the candidates';


         findAll();
         findSupporters();
        var display = true;
        var isHidden = true;

         $scope.addCandidateID = function(id) {
         candidateId.addID(id);
       }
   });

Answer 3

https://plnkr.co/edit/OsnmPzMTkBb88JrxacjL?p=preview

我在plunkr工作了一个最小的样本。

您没有将服务注入控制器：

    app.controller('candidatesController', ['$scope','$location', '$http', 'candidateId', function($scope, $location, $http, candidateId) {
   ...
    }]);

您必须声明控制器在阵列中需要的服务的名称。这是因为像uglifyjs这样的js最小化器有时会破坏参数名称，但是角度需要知道服务的名称，以便它可以找到它们。您请求了candidateId服务，但未将其声明为导入。

我还必须更新您的模块声明：

var app = angular.module('DonationWebApp', []);

空数组告诉angular你声明一个没有依赖项的新模块（该数组是依赖项列表）。如果没有数组，angular会查找名为DonationWebApp的现有模块，但找不到它。

如果这没有帮助，我们需要查看更完整的示例或查看您收到的错误消息。

您发布的控制器似乎不完整，所以我不得不推测您的数据模型可能是什么样子。确保在模板中正确拼写所有内容。

（服务）功能无法按下按钮

3 个答案: