2015-04-19 2 views
0

Я пытаюсь добавить resolve в мою $state в моей маршрутизации в соответствии с этим руководством here.

Идти дальше, чем руководство, добавляя параметры к функции, которые перестают работать.

мой код выглядит следующим образом

'use strict'; 

angular.module('academiaUnitateApp') 
    .config(function ($stateProvider, entryService) { 
    var getEntry = function(id) { 
     entryService.find(id) 
      .then(function(response){ 
       return response.data; 
      }) 
      .catch(function(error){ 
       return null; 
      }); 
    }; 

    $stateProvider 
     .state('entry', { 
      url: '/entry/:id', 
      templateUrl: 'app/entry/entry.html', 
      controller: 'EntryCtrl', 
      resolve: { 
       entry: getEntry($state.current.param.id) 
      } 
     }); 
    }); 

однако мой журнал консоли выглядит следующим образом:

Uncaught Error: [$injector:modulerr] Failed to instantiate module academiaUnitateApp due to: //didn't add this part tell me if needed 
Error: [$injector:unpr] Unknown provider: entryService 

Так от того, что я могу больше в том, что провайдер entryService не известно, если это исправьте, как я должен добавить это, вместо того, как я добавляю его в данный момент.




EDIT

Вот entryService

'use strict'; 

angular.module('academiaUnitateApp') 
    .factory('entryService',function($http, $state){ 
     var service = {}; 

     service.find = function(_id){ 
      return $http.get('/api/entrys/' + _id); 
     }; 

     return service; 
    }); 


приложение/app.js

'use strict'; 

angular.module('academiaUnitateApp', [ 
    'ngCookies', 
    'ngResource', 
    'ngSanitize', 
    'btford.socket-io', 
    'ui.router', 
    'ui.bootstrap', 
    'textAngular' 
]) 
    .config(function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) { 
    $urlRouterProvider 
     .otherwise('/'); 

    $locationProvider.html5Mode(true); 
    $httpProvider.interceptors.push('authInterceptor'); 
    }) 

    .factory('authInterceptor', function ($rootScope, $q, $cookieStore, $location) { 
    return { 
     // Add authorization token to headers 
     request: function (config) { 
     config.headers = config.headers || {}; 
     if ($cookieStore.get('token')) { 
      config.headers.Authorization = 'Bearer ' + $cookieStore.get('token'); 
     } 
     return config; 
     }, 

     // Intercept 401s and redirect you to login 
     responseError: function(response) { 
     if(response.status === 401) { 
      $location.path('/login'); 
      // remove any stale tokens 
      $cookieStore.remove('token'); 
      return $q.reject(response); 
     } 
     else { 
      return $q.reject(response); 
     } 
     } 
    }; 
    }) 

    .run(function ($rootScope, $location, Auth) { 
    // Redirect to login if route requires auth and you're not logged in 
    $rootScope.$on('$stateChangeStart', function (event, next) { 
     Auth.isLoggedInAsync(function(loggedIn) { 
     if (next.authenticate && !loggedIn) { 
      $location.path('/login'); 
     } 
     }); 
    }); 
    }); 

ответ

2

Необходимо указать зависимости, которые требуется вашему прикладному модулю. Чтобы иметь возможность вводить ваши услуги, ваше приложение должно знать модуль, где определен ваш entryService.

Если academiaUnitateApp.services это имя модуля, где entryService определена, необходимо указать зависимость, как показано ниже:

angular.module('academiaUnitateApp', ['academiaUnitateApp.services']) 
    .config(function ($stateProvider, entryService) { 
    // ... 
}); 

И тогда вы будете иметь возможность вводить какую-либо услугу (или контроллер ...) вам нужно в вашем приложении.

+0

обновил вопрос с надежностью 'entryService', это поможет немного осветить проблему. –

+1

Хорошо, у вас только один модуль. Я действительно рекомендую вам разделить ваши элементы приложения на другой модуль. Этот проект показывает хорошие способы структурирования ваших угловых проектов: https://github.com/angular/angular-seed/blob/master/app/app.js Здесь, если вы действительно хотите сохранить один модуль, вы должны определить пустой массив в вашем первом определении модуля приложения. => angular.module ('academiaUnitateApp', []). – Truche

+0

Думаю, вам не хватает ссылки на проект, о котором вы говорите? –

1

Вот мои app.js (правила маршрутизации с использованием состояния)

.state('books.show.detail',{ 
     url: '/detail/:bookId', 
     templateUrl: 'views/book.detail.html', 
     controller: 'BookDetailCtrl', 
     resolve: { 
      bookDetails: function(BookDetailsService,RestClient,$q,$stateParams){ 
      console.log($stateParams.bookId); 
      var book = BookDetailsService(RestClient,$q,$stateParams.bookId); 
      return book.get(); 
      } 
     } 
     }); 

А вот мой service.js где BookDetailsService определяется

var services = angular.module('uiAngularClientApp.services',['ngResource']); 

services.factory('RestClient',['$resource', function ($resource) { 
    return $resource('http://localhost:8080/books/:id',{id:'@id'}); 
}]); 

services.factory('BookDetailsService',['RestClient','$q',function(RestClient,$q,key){ 
    return function(RestClient,$q,key){ 
    return new GetBookDetails(RestClient,$q,key); 
    }; 
}]); 

function GetBookDetails($resource, $q, key) { 
    this.get = function() { 
    var delay = $q.defer(); 
    $resource.get({id:key},function(book){ 
     delay.resolve(book) 
    },function(){ 
     delay.reject('Cannot get book details'); 
    }); 
    return delay.promise; 
    }; 
}; 

отлично работает. Наиболее важным является определение BookDetailsService в service.js.

Смежные вопросы