范围事件传播

Question

我有一个控制器嵌套在另一个控制器中。

<div ng-controller="manufacturerController" ng-cloak>
    <div ng-controller="contractController" ng-cloak>
        <div data-ng-if="item" class="panel panel-default">
            <div class="panel-heading text-center">
                <span class="h3">Contract</span>
            </div>
        </div>
    </div>
    <button data-ng-if="item && !ajaxOut" class="btn btn-success" data-ng-click="saveItem()">Save</button>
</div>

通过按钮调用saveItem（），代码在manufacturerController中：

    $scope.saveItem = function () {
        $scope.ajaxOut = true;
        $scope.saveContracts();
    };

但是函数saveContracts（）在contractController中。我想从manufacturerController.saveItem（）调用contractController.saveContracts（）。

根据这里我应该可以调用父方法：How to call a function from another controller in angularjs?

但是保存正在冻结浏览器。我做错了什么，如何解决？

Answer 1

一种方法是在范围内广播事件：

function ParentController($scope) 
{
  $scope.$broadcast('someEvent', args);
}

function ChildController($scope) 
{
  $scope.$on('someEvent', function(event, args) {});
  // another controller or even directive
}

范围事件传播

范围可以以类似的方式将事件传播到DOM事件。该事件可以broadcasted到范围子项，或emitted范围为父项。

— AngularJS Developer Guide - Scope Event Propagation

有关详细信息，请参阅Can one controller call another?

Answer 2

您可以将父母的$ broadcast用于儿童：

function ParentCntl($scope) {

    $scope.msg = "";
    $scope.get = function(){
        $scope.$broadcast ('someEvent');
        return  $scope.msg;        
    }
}

function ChildCntl($scope) {               
    $scope.$on('someEvent', function(e) {  
        $scope.$parent.msg = $scope.get();            
    });

    $scope.get = function(){
        return "xyz";    
    }
}

Answer 3

查询＆＃34; $ on $ emit $ broadcast angularjs＆＃34;。那里有很多例子。

（正如我之前在评论中所说，你不希望管制员彼此了解。一个人发出一个事件/通知，另一个人听到它，有点像你不知道的人只是站在一个房间里喊着一个你感兴趣的名字。

每个用于不同的上下文。根据您正在做的事情，您可以使用其中一个。了解其中的每一个对AngularJS开发人员（以及任何UI开发人员的整体概念）都非常重要。

从父控制器调用子控制器中的函数

3 个答案:

范围事件传播