AngularJS ng-route как сделать http запрос на разрешение
У меня есть простой шаблон с входом и якорной ссылкой, которая при нажатии на нее загрузит другой шаблон. Я хочу, чтобы второй шаблон извлекал информацию через http-запрос.
Я использую ng-route для перенаправления на шаблон поиска по умолчанию и на шаблон результатов из пути / search /: title, и я пытаюсь использовать функцию решимости, чтобы сделать запрос перед загрузкой шаблона результатов (код в плункер)
Основная проблема, с которой я сталкиваюсь, заключается в том, что когда я добавляю разрешение, контроллер перестает инициализироваться (я думаю, он будет загружаться после возвращения обещания). Это означает, что переменные, такие как URL-адрес поиска, не инициализируются, а $ routeParams пустые, когда я печатаю их в функции поиска контроллера.
Как мне это сделать?
Я также не уверен в правильном синтаксисе для разрешения. Первый поиск - это переменная области видимости?
resolve: {
search: searchController.search
}
Для тех, кому лень проверять Plunker, вот соответствующий код:
маршрутизация
.config(['$routeProvider',function($routeProvider) {
$routeProvider.
when('/search', {
templateUrl: 'templates/search.html'
}).
when('/search/:title', {
templateUrl: 'templates/result.html',
controller: 'searchController',
resolve: {
search: searchController.search
}
}).
otherwise({
redirectTo: '/search'
});
}]);
searchController
var searchController = search.controller('searchController', ["$http", "$scope", "$location", '$rootScope', '$routeParams', function($http, $scope, $location, $rootScope, $routeParams) {
console.log("Controller constructor");
this.searchURL = 'http://www.myapifilms.com/imdb?title=%thetitle%&format=JSON';
$scope.response = '<Response here>';
this.title = '';
this.defer = null;
console.log("PARAMS: " + JSON.stringify($routeParams));
}]);
searchController.search = function searchMovie($q, $routeParams) {
searchController.defer = $q.defer;
var searchString = $routeParams.title;
url = searchController.searchURL.replace('%thetitle%', searchString);
console.log("URL: " + url);
searchController.searchRequest(url);
};
searchController.searchRequest = function(url) {
$http.get(url).success(function(data) {
....
searchController.defer.resolve();
return searchController.defer.promise;
})
.error(function(data, status, headers, config) {
...
searchController.defer.resolve();
return searchController.defer.promise;
})
};