javascript - 服务功能未触发

Question

我有一个 Controller ，可以很好地在 div 元素上切换隐藏和显示，在此阶段我正在尝试清理，因此我开始使用服务。

内部带有切换方法的 Controller 代码段

    app.controller('addFormCtrl', function($scope, $http, $timeout, Service){
      $scope.myVar = true
      $scope.toggle = function (){
        $scope.myVar = !$scope.myVar
        //once toggled i.e form taken away success or failure message displayed for x time
        $scope.successOrFailureAlert = true;
        $timeout(function () {$scope.successOrFailureAlert = false}, 2000)
      }
})

服务

app.service('Service', function($timeout){
  var user = ""
  var location = ""

  this.toggle = function(var1,var2){
    console.log(var1)
    console.log(var2)
    var1 = !var1
    var2 = true;
    $timeout(function () {var2 = false}, 2000)
  }
})

已添加服务的 Controller

    app.controller('addFormCtrl', function($scope, $http, $timeout, Service){
      $scope.myVar = true
      $scope.toggle = Service.toggle($scope.myVar, $scope.successOrFailureAlert)

      //function (){
      //  $scope.myVar = !$scope.myVar
      //  once toggled i.e form taken away success or failure message displayed for x time
      //  $scope.successOrFailureAlert = true;
      //  $timeout(function () {$scope.successOrFailureAlert = false}, 2000)
      //}
})

当我使用该服务而不是在那里定义方法时。没有发生任何事情，开关不会触发。我希望我能在上下文信息方面添加更多内容

HTML

<div ng-controller="addFormCtrl">
  <span ng-show="successOrFailureAlert"> {{status}} </span>
  <button ng-click="toggle()"> Add Employee </button>
  <form ng-hide="myVar" ng-submit="submitAddEmployeeForm()">
    <input type="text" ng-model="name">
    <input type="text" ng-model="country">
    <input type="submit" value="Submit" />
  </form>
</div>

Answer 1

在函数内调用它，因为您的 ng-click 需要一个函数。

$scope.toggle = function(){
  Service.toggle($scope.myVar, $scope.successOrFailureAlert);
}