javascript - 在angular js中从另一个 Controller 调用另一个函数

Question

我想调用另一个 Controller 中的函数并获得响应

var app = angular.module('myApp', []);
app.controller('mini_cart', function($scope, $http) {   
  $scope.update = function() {
    alert("Updated");
  }
  $scope.update();
});

我想在这个 Controller 上调用这个更新方法

app.controller('item_detail', function($scope, $http) {
  $scope.update(); //But this is not working
});

有什么方法可以调用那个方法吗？

Answer 1

例如，在我的回答中，我使用了变量，但是您可以通过函数调用来做同样的事情。

方式一:使用服务

服务是单例的，您可以通过服务传递数据。例如，我们将我们的服务称为 dataservice:

angular
  .module('app')
  .controller('FirstController', ['dataservice']);

function FirstController(dataservice) {
  dataservice.dataToPass = 'data to pass through controllers';
}

你可以像这样从第二个 Controller 获取这些数据:

angular
  .module('app')
  .controller('SecondController', ['dataservice']);

function SecondController(dataservice) {
  let dataFromFirstController = dataservice.dataToPass;
}

第二种方式:使用$emit/$broadcast(仅当 Controller 是父子时)

您可以通过$emit向上传递数据，或者通过$broadcast向下传递数据($emit 和$broadcast工作方式类似，我将仅使用 $broadcast) 来展示示例。如果 FirstController 是父级而 SecondController 是子级，您可以像这样通过它们传递数据:

angular
  .module('app')
  .controller('FirstController', ['$scope']);

function FirstController($scope) {
  $scope.$broadcast('passDataFromParentToChild', 'Data from FirstController');
}

并在SecondController中获取数据:

angular
  .module('app')
  .controller('SecondController', ['$scope']);

function SecondController($scope) {
  $scope.$on('passDataFromParentToChild', function (event, data) {
    console.log(data); // will be "Data from FirstController"
  });
}

第三种方式:使用$scope.$parent(仅当 Controller 是父子时)

如果您想从子 Controller 更改父 Controller 的变量，这是最简单的方法(假设 FirstController 是 SecondController 的父级):

angular
  .module('app')
  .controller('FirstController', ['$scope']);

function FirstController($scope) {
  $scope.varFromParentController = 'First';
}

让我们从 SecondController 更改 $scope.varFromParentController:

angular
  .module('app')
  .controller('SecondController', ['$scope']);

function SecondController($scope) {
  $scope.$parent.varFromParentController = 'Second';
}

关于$rootScope

您也可以使用$rootScope，但这是一种不好的做法，最好选择上述方式之一。