Angularjs передают данные между службами, которые существуют на разных страницах

Question

У меня есть пример простого книжного магазина, который я работаю для angularjs, и я пытаюсь передать идентификатор книги с домашней страницы в службу на странице редактирования, чтобы детали книги могут быть представлены. То, что я произошло, это то, что я вижу, как остальные звонки удаляются из моей загрузки, когда другая страница вызывает службу останова. Порядок Я ожидаю это:

1) User enters a book ID to edit 
2) User presses Search button 
3) book.html page is loaded 
4) BookEdit service is invoked with ID from Steps 1 and 2 
5) ng-model for book loads data. 

Извинения заранее, могут быть некоторые ошибки, как я модифицируя этот код с другого компьютера, поэтому я не мог копировать/вставить
код ниже:

home.html

<div ng-controller="HomeCtrl">  
    <div> 
      <label for="query">Book to edit</label> 
      <input id="query" ng-model ="editBook.query"> 
      <button ng-click="loadBookById()">Search</button> 
    </div> 
</div> 

home.js:

var homeApp = angular.module('bookHome',['bookEdit']); 
homeApp.controller('HomeCtrl',function($scope,$http,bookEditService) 
{  
    $http.get('http://get/your/books/rest').success(function(data){ 
     $scope.library = data; 
    }); 

    $scope.editBook = {  
     query: '', 
     service:'bookEditService' 
    } ; 

    $scope.loadBookById = function() 
    { 
     $scope.$emit('loadBookById',{ 
      query:$scope.editBook.query, 
      $service: $scope.editBook .service 
    } 

    $scope.$on('loadBookById', function(ev,search){ 
     bookEditService.loadBook({ 
       bookId: $scope.editBook.query 
      }, 
      $scope.searchComplete, 
      $scope.errorSearching 
      ); 
     }); 
    $scope.searchComplete = function(results) { 
      $scope.results = results; 
     }; 

    $scope.errorSearch= function(data,status,headers,config){ 
      console.log(data); 
      // ... 
    }; 
} 

book.html

<div ng-controller="BookCtrl" >  

     <div ng-model="details.title"></div> 
     <div ng-model="details.author"></div> 
</div> 

bookEdit.js

var bookEditApp = angular.module('bookEdit',[]); 
    bookEditApp.service('loadBook',function($http){ 
     return{ 
       loadBookById: function(params,success,error){ 
       $http({ 
        url: 'http://path/to/book/editing', 
        method: 'GET', 
        params:{bookId: params.bookId}).success(function(data,status,headers,config) 
        { 
        var results = data; 
        success(results || []); 
       }).error(function(){ 
         error(arguments); 
       }); 
      } 
      }; 
     }); 

bookEditApp.controller('BookCtrl',function($scope){  
      $scope.details = {  
       title: "", 
       author: "" 
      }; 
}); 

Answer 1

Альтернатива, которая следует за заказ вы ожидаете является:

1) Пользователь вводит идентификатор книги и нажимает кнопку

2) HomeCtrl направляет в EditCtrl с введенным идентификатором в качестве параметра маршрута (пока не нужно пользоваться книжным сервисом):

app.controller('HomeCtrl', function ($scope, $location) { 

    $scope.editBook = function() { 
     $location.path('/edit/' + $scope.id); 
    }; 

    }); 

3) EditCtrl загружен, получает параметр маршрута и просит службу книги для правильной книги:

app.controller('EditCtrl', function EditCtrl($scope, $routeParams, bookService, $location) { 

    $scope.loading = true; 

    bookService.getBookById($routeParams.id) 
     .then(function (result) { 
     $scope.book = result; 
     $scope.loading = false; 
     }); 

4) Когда книга загружается модель ($scope.book) заполняется и HTML обновляется

Вот рабочий пример, который мы надеемся, даст некоторые дополнительные рекомендации и идеи: http://plnkr.co/edit/fpxtAU?p=preview