如何从 AngularJS 中的 Controller-B 调用 Controller-A 中的函数答案

【问题标题】：How to call a function inside Controller-A from Controller-B in AngularJS如何从 AngularJS 中的 Controller-B 调用 Controller-A 中的函数
【发布时间】：2014-11-28 10:10:50
【问题描述】：

我的代码是这样的

Controller.JS
    angular.module('RateRequestApp.controllers', []).controller('ReadOnlyController', function($scope, rateRequestService) {
    $scope.rateData = [];

    rateRequestService.getData().success(function(response) {
        $scope.rateData = response;
    }).error(function (data, status, headers, config) {

         $scope.openModal();
    });
});

angular.module('RateRequestApp.controllers').controller('ModalDemoCtrl', function($scope, $modal, $log) {


    $scope.openModal = function(size) {

        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: 'ModalInstanceCtrl',
            size: size,

        });
    };


});


App.JS

    angular.module('RateRequestApp', [
   'RateRequestApp.services',
   'RateRequestApp.controllers',
   'ui.bootstrap'
]);

如您所见，我试图在另一个控制器中调用函数$scope.openModal();，显然它会引发错误

TypeError: undefined is not a function

一行

   $scope.openModal();

有什么办法可以解决这个问题吗？

【问题讨论】：

标签： angularjs

【解决方案1】：

由于控制器不可注入，我不会尝试。尝试改用共享服务。

【讨论】：

好吧，它们可能可以通过 $controller 服务注入...但是您为什么要这样做？我认为它的设计不好。
我不完全理解你的答案，你能详细说明一下吗？
您不能将“ReadOnlyController”注入到另一个控制器函数中。 Angular 不允许这样做。有一个很好的理由，它不是为了允许这样做而设计的。
这个问题没有其他解决方案了吗？

【解决方案2】：

您可以使用角度控制器服务 $controller 将控制器注入另一个控制器

angular.module('RateRequestApp.controllers', []).controller('ReadOnlyController', ['$controller','$scope', function($scope, rateRequestService,$controller) {
    var modalDCtrl = $scope.$new();
    $controller('ModalDemoCtrl',{$scope : modalDCtrl });
    $scope.rateData = [];
    rateRequestService.getData().success(function(response) {
        $scope.rateData = response;
    }).error(function (data, status, headers, config) {
        modalDCtrl.openModal();
    });
}]);

但是，您还需要将方法附加到控制器实例而不是 $scope。

angular.module('RateRequestApp.controllers').controller('ModalDemoCtrl',  function($scope, $modal, $log) {
    this.openModal = function(size) {
        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: 'ModalInstanceCtrl',
            size: size,
        });
    };
});

参考：How do I inject a controller into another controller in AngularJS

【讨论】：

你的代码给了我一个错误 Error: [ng:areq] Argument 'ReadOnlyController' is not a function, got string
已编辑。也许是因为我忘记了依赖注入的“[”。基本上使用与您相同的代码设置，但 - 将 $controller 服务注入您的“ReadOnlyController” - 使用 $controller('ModalDemoCtrl',{$scope : modalDCtrl }); 定义另一个控制器； - 在“ModalDemoCtrl”中将“$scope”更改为“this”
现在这会引发错误 TypeError: undefined is not a function at line modalDCtrl.openModal();
尝试通过在 $new() 方法中传递 true 来创建隔离范围 - $new(true)。

【解决方案3】：

在应用内定义您的控制器，然后根据需要注入它们。您还没有提到模型实例控制器的实现。所以我假设你忘记了实现它。

angular.module('RateRequestApp.controllers', []).controller('ReadOnlyController', function($scope, rateRequestService) { 
                // ReadOnlyController's logic
}));

angular.module('RateRequestApp.controllers').controller('ModalDemoCtrl', function($scope, $modal, $log) { 

/**
 *  This might be missing
 */
var ModalInstanceCtrl = function ($scope, $modal) {
            // ModalInstanceController's logic
};

$scope.openModal = function(size) {

        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: ModalInstanceCtrl,
            size: size,

        });
    };

}));



App.JS

    angular.module('RateRequestApp', [
   'RateRequestApp.services',
   'RateRequestApp.controllers',
   'ui.bootstrap'
]);

希望上面的 sn-p 会有所帮助:)

【讨论】：

【解决方案4】：

$controller 会有所帮助，试试这个链接https://docs.angularjs.org/guide/controller 你会明白的。

【讨论】：