Question

我对如何在Angular中的控制器之间进行通信而不使用广播/发射感到困惑。

我们说我们有Controller1

$scope.calledOnClick = function() { }

我们有Controller2和

$scope.function2 = function() { }

当从ng-click执行calledOnClick时，我们希望调用function2。

我知道我们可以使用广播来做到这一点，但有哪些替代方案呢？

Answer 1

可以使用javascript继承概念通过共享服务进行通信。假设我们有两个控制器，即“ parentController”和“ ChildController”，以及一个服务，即“ sharedserviice”。

(function() {
    'use strict';

    angular
        .module('MapAppication')
        .controller('parentController', parentController);

    parentController.$inject = [
        'sharedService',
        '$mdDialog',
        '$document'
    ];

    /* @ngInject */
    function parentController(sharedService,$mdDialog,$document) {
        var vm = this;
        vm.parentInput = 200;
        var service = sharedService.getInstance();

        vm.addition = function(){
            vm.sum = vm.parentInput + parseFloat(service.getData());
        }
    }
})();

'<div>
    parent controller
    <md-input-container>
        <input type="text" aria-label ="name" ng-model="vm.parentInput" required>
    </md-input-container>
    <div ng-include="../map/view/child.html"></div>
    <button class="md-primary" ng-click="vm.addition()"> addition</button>
    <div>
        sum
        <md-input-container>
            <input type="text" aria-label ="name" ng-model="vm.sum">
        </md-input-container>
    </div>
</div>'


(function() {
    'use strict';

    angular
        .module('MapAppication')
        .controller('ChildController', ChildController);

        ChildController.$inject = ['$scope','sharedService'];

    /* @ngInject */
    function ChildController($scope,sharedService) {
        var vm = this;
        vm.name = "dfghj";
        vm.childInput = 200;
        var x = sharedService.getInstance();
        x.getData =  function(){
            return  vm.childInput;
        }
        $scope.$on("$destroy", function() {
            sharedService.createNewInstance();
        });
    }
})();

<div ng-controller="ChildController as vm">
    Child controller
    <md-input-container>
        <input type="text" aria-label ="name" ng-model="vm.childInput" required>
    </md-input-container>
</div>

(function() {
    'use strict';

    angular
        .module('MapAppication')
        .service('sharedService', sharedService);

    sharedService.$inject = [];

    /* @ngInject */
    function sharedService() {
        var service = {
            getInstance : getInstance,
            getSum : getSum,
            createNewInstance  :createNewInstance
            //getData : getData
        }

        var instance;
        createNewInstance();

        function SharedObject(){
            this.getData = function(){
                return false;
            }
        }

        function getInstance(){
            return instance;
        }

        function createNewInstance(){
            instance =  new SharedObject();
        }


        function getSum(parentvalue){
            var childValue = getChildValue()
            return parentvalue + childValue;
        }
        function getChildValue(){
            return instance.getData();
            //return instance.getChildCtrValue();
        }
      return service;
    }
})();

Answer 2

如果你使用指令而不仅仅是控制器，你可以要求父，子或兄弟指令的控制器并以这种方式调用它。

另一个选择是拥有一个共同的服务（这些是单身，记住）和“注册”＃39;您的控制器以某种方式接收回调事件。然后你就可以进行相应的调用。

当然你也可以使用$ scope继承并直接调用该方法，虽然我不推荐它，因为它会让人感到困惑。

如何在没有广播/发射的情况下在控制器之间进行通信？

2 个答案: