Question

所以，这是一个示例代码：

<div ng-controller="MyControllerOne">
    <span ng-click="foobar()">Click Me!</span>
</div>

我是否可以在不更改控制器的情况下，在 MyControllerTwo 中调用函数 foobar（）：

.controller('MyControllerOne', function($scope) {
    //some code
})
.controller('MyControllerTwo', function($scope) {
    // method I wanna call
    function foobar(){
    }
})

Answer 1

虽然不是最漂亮的解决方案，但技术上可行......是......

如果您将HTML更新为：

<div ng-controller="MyControllerOne">
    <span ng-controller="MyControllerTwo as mct" ng-click="mct.foobar()">Click Me!</span>
</div>

然后你应该得到预期的结果。

Answer 2

您可以通过在控制器中注入“$ controller”服务，从模板中调用另一个控制器中的方法。以下是演示和代码。

您可以在此处查看演示：http://plnkr.co/edit/oBEKxamgJv0uDVsJJwth?p=preview

HTML：

  <body ng-controller="MainCtrl">
    <div ng-click="fooBar()">Click Me!</div>
  </body>

JS：

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

app.controller('MainCtrl', function($scope, $controller) {
  $controller('SubCtrl', {$scope: $scope});
});

app.controller('SubCtrl', function($scope) {
  $scope.fooBar = function() {
    alert('second controller');
  };
});

Answer 3

很老的问题，但如果还有人还在寻找替代答案...... 应该可以使用$ emit或$ broadcast。

来自ControllerOne：

$rootScope.$broadcast('callToFoobat',{});

然后从ControllerTwo：

$scope.$on('callToFoobat', function(){ 
    // whatever you want, so why not a call to foobar 
})

只是一个粗略的解决方案。可能比$ rootScope更优雅或更轻。$ broadcast。也许可以考虑在需要时停止传播。

Ionic - AngularJS：通过Controller外部的模板调用方法

3 个答案: