Vinculando um controlador a outro para chamar o serviço no ng-click

Eu tenho dois modelos com os respectivos controladores e arquivos de serviço. O controlador de um modelo (fleetListTemplate) (fleetListController) carrega dados de seu arquivo de serviço (fleetService) e exibe em sua visualização (fleetListTemplate).

Quando isso acontece, e clico em um dos dados carregados de fleetService, devo vincular fleetListController a fleetSummaryController para obter dados de seu arquivo de serviço (fleetSummaryService) e exibir na visualização fleetSummaryTemplate.

Alguém pode me ajudar com a codificação? Obrigado.

A seguir estão os respectivos módulos, modelos, controladores e arquivos de serviço.

fleetListModule

"use strict"; angular.module("fleetListModule", []); 

fleetListTemplate

 
TRUCKS
TruckID Status Dest. Alerts
{{truck.truckID}} {{truck.status}} {{truck.destination}} {{truck.alerts}}

fleetListController

 "use strict"; angular.module("fleetListModule").controller("fleetListController", ['$scope', 'fleetsService', function ($scope, fleetsService) { $scope.trucks = fleetsService.getTrucks(); $scope.summaryData = function () { $rootScope.$broadcast('obtainSummary'); } }]); 

fleetSummaryModule

 "use strict"; angular.module("fleetSummaryModule", []); 

fleetSummaryTemplate

 
Summary
Truck ID: {{summary.truckID}} Trailer ID: {{summary.trailerID}} Driver ID: {{summary.driverID}} Truck Number: {{summary.truckNumber}} Trailer Number: {{summary.trailerNumber}} Insurance Due Date: {{summary.insuranceDueDate}} Maintenance Due Date: {{summary.maintenanceDueDate}}

fleetSummaryController

 "use strict"; angular.module("fleetSummaryModule").controller("fleetSummaryController", ['$scope', 'fleetSummaryService', function ($scope, fleetSummaryService) { $scope.$on('obtainSummary', function (event, args) { $scope.truckSummary = fleetSummaryService.getSummary(); }) }]); 

fleetSummaryService

 "use strict"; angular.module("fleetSummaryModule").service("fleetSummaryService", function () { this.getSummary = function () { return summary; }; this.getSummary = function (truckID) { for (var i = 0, len = truckSummary.length; i < len; i++) { if (truckSummary[i].truckID === parseInt(truckID)) { return truckSummary[i]; } } return {}; }; var truckSummary = [ { truckID: 1, trailerID: '123', driverID: 'Alex123', truckNumber: 'hyt 583', trailerNumber: 'xyz213', insuranceDueDate: '25-12-2015', maintenanceDueDate: '31-12-2015' }, { truckID: 2, trailerID: '456', driverID: 'Alex123', truckNumber: 'hyt 583', trailerNumber: 'xyz213', insuranceDueDate: '25-12-2015', maintenanceDueDate: '31-12-2015' }, { truckID: 3, trailerID: '789', driverID: 'Alex123', truckNumber: 'hyt 583', trailerNumber: 'xyz213', insuranceDueDate: '25-12-2015', maintenanceDueDate: '31-12-2015' } ]; }); 

Este exemplo simples mostra como compartilhar dados entre dois controladores “em um aplicativo” usando o serviço comum.

 angular.module("app", []); ///controller1 angular.module("app").controller("controller1", function ($scope, service) { $scope.lists = [ { name: "maher" }, { name: "Gaurav Ram" }, { name: "Shaun Scovil" } ]; $scope.send = function () { service.set("lists", $scope.lists); //set(key, value) $scope.lists = []; //optional } }); ///controller2 angular.module("app").controller("controller2", function ($scope, service) { $scope.lists = []; //get data from broadcast on the root service.get("lists"); // get(key) //set data $scope.resive = function () { if (angular.isUndefined($scope.broadcast)) { $scope.alert = "No data to resive!"; } else { $scope.alert = null; $scope.lists = $scope.broadcast; } } }); ///service angular.module("app").service("service", function ($rootScope) { this.set = function (key, value) { $rootScope.$broadcast(key, value); } this.get = function (key) { $rootScope.$on(key, function (event, data) { $rootScope.broadcast = data; }); } }); 
       

Data sent to controller 2, click Resive button to get data