我有一个 Controller ,我认为它是我的“根” Controller ,它是用 ng-controller
属性声明的 Controller ,然后是通过 动态实例化的其他一些 Controller $路由提供者
。我想声明一个函数,该函数可通过任何动态/子 Controller 范围内的 ng-click
属性使用。
我可以在我的根 Controller 上声明这个函数,例如
$scope.announce = function () {
alert($scope.specificName);
}
然后我在所有“子” Controller 的所有作用域中看到它,但是此函数中使用的 $scope
是根 Controller 的本地变量,而不是当前事件的作用域/ Controller 。如何访问此函数中的事件子作用域?
最佳答案
我在这个 plunker 中有一些工作涵盖了一些用例。
该函数将接受一个参数。此参数在每个范围内将具有相同的名称。
<body ng-app="MyApp">
<div ng-controller="mainCtrl">
<button ng-click="announce(specificName)">announce in main</button>
<div ng-controller="subCtrl">
<button ng-click="announce(specificName)">announce in sub</button>
</div>
</div>
</body>
你的主 Controller 看起来像这样:
angular.module('MyApp').controller('mainCtrl', function($scope, ItemService){
$scope.specificName = "I'm main !";
$scope.announce = function(specificName){
alert(specificName);
}
});
并且只需覆盖子 Controller 中的“specificName”变量:
angular.module('MyApp').controller('subCtrl', function($scope, ItemService){
$scope.specificName = "I'm a sub !";
});
要在纯 JS 中调用该函数,您可以在每个 Controller 中执行此操作:
$scope.announce($scope.specificName);
编辑:
我刚刚意识到还有其他解决方案可以满足您的需求。您可以使用工厂或服务来共享该功能。
服务的外观:
myApp.service("AnnounceService",
function(){
var service = {};
service.announce = function(toAnnounce){
alert(toAnnounce);
}
return service;
}
);
你的 Controller 会是什么样子:
angular.module('MyApp').controller('subCtrl', function($scope, AnnounceService){
$scope.announce = AnnounceService.announce;
$scope.specificName = "I'm a sub !";
//Equivalent
$scope.announce($scope.specificName);
AnnounceService.announce($scope.specificName);
});
这与您需要在每个 Controller 中声明 specificName 并将其传递给函数是一回事。但该功能可用于您应用程序的任何部分。你只需要注入(inject)服务和
详细信息:
最后,抽象部分不是函数,而是每个 Controller 中变量的名称。一种约定俗成的命名。
如果此变量与状态相关,您可以将其添加到状态定义中。 (如果是这样的话,我可以试着给你举个例子。)
我也不建议将完整的 $scope 给另一个。这在 Angular 上不是一个好的做法。
希望这能解决您的问题,或者提供足够的线索。
请随意询问更具体的事情,我会编辑答案以适应您的需求。
关于javascript - 从 'current' Controller 访问 'root' 范围,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30613044/