Я пытаюсь вызвать функцию при передаче данных с одного контроллера на другой в AngularJS. Но это не работает для меня в Angular v.1.2. Мне нужно вызвать функцию ctrl1 из ctrl2. Кто-нибудь может дать мне идею по этому вопросу?

Пример кода:

    <div ng-contorller="ctrl">
      <div ng-contorller="ctrl1">
      </div>
      <div ng-contorller="ctrl2">
      </div>
    </div>

function parentctrl(){

}
function ctrl1($scope){
 $scope.callfn = function(){
 console.log("success");
}
 $scope.$on('emitdata', function(event, data){
    $scope.callfn();
 })
}
function ctrl2($scope){       
 $scope.$emit('emitdata', {'key':'uu'});
}
1
uday s 18 Дек 2015 в 18:32

3 ответа

Лучший ответ

Или вы можете использовать как эмиссию, так и трансляцию. Детские прицелы выбрасывают, родители вещают. Примерно так: http://plnkr.co/edit/pjGIHByzkwCeNiaVrdb6?p=preview

app.controller("ctrl", function($scope) {
  $scope.$on('emitdata', function(event, data) {
    // This event will reach: ctrl -> ctrl1 + ctrl2
    $scope.$broadcast('broadcast-data', data);
  });
});

app.controller("ctrl1", function($scope) {
  $scope.$on('broadcast-data', function(event, data) {
    $scope.received = data;
  })
});

app.controller("ctrl2", function($scope) {
  $scope.emit = function() {
    // This event will reach: ctrl2 -> ctrl -> rootScope
    $scope.$emit('emitdata', {'key': 'uu'}); 
  };
});
2
ippi 19 Дек 2015 в 00:31

$emit передает события вверх, что означает, что излучающий контроллер должен находиться внутри слушающего контроллера.

<div ng-controller="ctrlone">
    <div ng-controller="ctrltwo">
        <!-- ctrltwo is the emitting controller
             ctrlone is the listening controller -->
    </div>
</div>

Теперь, если есть два контроллера, которые находятся на одном уровне, как это:

<div ng-controller="parent">
    <div ng-controller="ctrlone">
        <!-- i listen for an event -->
    </div>
    <div ng-controller="ctrltwo">
        <!-- i raise an event -->
    </div>
</div>

Для ctrlone нет прямого способа связаться с ctrltwo и наоборот. В этой ситуации вы можете использовать $rootScope.$broadcast вместо emit:

function ctrltwo($rootScope) {
    $rootScope.$broadcast('myEvent', {'key':'uu'});
}

function ctrlone($scope) {
    $scope.$on('myEvent', function(event, data){
        $scope.callfn();
    });
}

Вы также можете использовать $scope.$parent вместо $rootScope, но будьте осторожны при этом, потому что это может перестать работать, если вложение контроллера изменится.

1
OJ Raqueño 18 Дек 2015 в 16:24

Вот как должна выглядеть функция ctrl2:

function ctrl2($scope, $rootScope) {
    $rootScope.$broadcast('emitdata', {'key':'uu'});
}

$ emit - отправить вверх, $ broadcast - отправить вниз. $ rootScope находится вверху.

0
Tzook 18 Дек 2015 в 16:32