AngularJSで$ broadcastを使用する2つのコントローラのid変数を自動的に更新します

$ctrl.clicker = function(id) 
{ 
    $rootScope.$broadcast('idBull', id); 
}

私が画像にマウスを置くと、上記の関数が呼び出されます。別のコントローラでIDを共有し、このIDに加えられた変更をブロードキャストします。

$scope.$on('idBull', function (event, data) { 
    console.log(data); // 'Data to send' 
});

他のコントローラでは、自分のIDのコンソールログを実行するためにコードを使用しましたが、結果はありませんでした。

var app = angular.module('myApp', []) 
.controller('ControllerA', function($scope) { 
    $scope.increment = 0; 
    $scope.add = function() { 
     $scope.$broadcast('hasIncremented'); 
    } 

}). 
controller('ControllerB', function($scope) { 
    $scope.$on('hasIncremented', function(event) { 
     $scope.increment++; 
    }); 
})

出典

2017-12-08 Behrouz Hedayati

あなたがサービスを使用する必要がありますようにそれはそう、これを行うのではなく –

http://jsfiddle.net/87rLob9x/ チェックこのバイオリンはそれが HTML

<html ng-app="myApp"> 
<div ng-controller='ControllerA'> 

    <button ng-click='add()'>Add</button 
</div> 
<div ng-controller='ControllerB'> 
    {{ increment }} 

</div> 

</html>

jsのに役立ちます願っています/ $rootScope.$broadcastが実行されるとロードされますか？

もう1つの解決策は、両方のコントローラに注入して代わりに通信に使用するサービスを使用することです。放送ソリューションの例：カスタムサービスとソリューションの

var app = angular.module("app", []) 
.controller("ControllerA", function($scope, $rootScope) 
{ 
    $scope.clicker = function(id) 
    { 
     $rootScope.$broadcast("id changed", id); 
    } 
}) 
.controller("ControllerB", function($scope) 
{ 
    $scope.$on("id changed", function(event, id) 
    { 
     // Do whatever you need to do with id 
    }); 
});

例：

var app = angular.module("app", []) 
.factory("customService", function() 
{ 
    var callbacks = []; 

    return { 
     onIdChange: function(callback) 
     { 
      callbacks.push(callback); 
     }, 
     idChanged: function(id) 
     { 
      callbacks.forEach(function(callback) 
      { 
       callback(id); 
      }); 
     } 
    }; 
}) 
.controller("ControllerA", function($scope, customService) 
{ 
    $scope.clicker = function(id) 
    { 
     customService.idChanged(id); 
    } 
}) 
.controller("ControllerB", function(customService) 
{ 
    customService.onIdChange(function(id) 
    { 
     // Do whatever you need to do with id 
    }); 
});

出典

2017-12-08 22:09:00

ないあなたは多分$scope.$onとコントローラが作成されていない、あなたのコードが動作するように取得されていません理由を確認してください。

出典

2017-12-09 00:41:58 Marcus

AngularJSで$ broadcastを使用する2つのコントローラのid変数を自動的に更新します

答えて

関連する問題