2017-02-15 6 views
5

Я построил небольшое поисковое приложение, используя Angular, UI Router и Elasticsearch, и я пытаюсь получить параметры запроса UI-маршрутизатора в URL-адресе на странице результатов.UI Router и параметры запроса

Я пытаюсь добиться этого

domain.com/search?user_search_terms 

с этим

.state('search', { 
     url: '/search?q', 

и я инициализировать searchTerms и $ stateParams, как это в моем контроллере

vm.searchTerms = $stateParams.q || ''; 

, а затем в моем функция поиска в моем контроллере у меня есть

vm.search = function() { 
      $state.go('search', {q: vm.searchTerms}); 
... 

Все работает нормально, пока не попытаюсь выполнить параметры запроса маршрута UI. Я все еще могу получить предложения по поиску, переход из состояния в состояние, но поисковые разрывы.

Я думал, что мне нужно реализовать угловые $ http get params в конфиге {}, но потом я понял, что я просто пытаюсь получить параметры запроса с помощью UI Router. Кажется, у меня есть все, что нужно настроить с помощью UI Router, чтобы получить параметры запроса, но ... что я делаю неправильно?

ответ

7

Для параметров запроса, вы должны использовать $state.params вместо $stateParams

PLUNKER DEMO

ГОСУДАРСТВЕННОЙ CONFIG:

stateProvider.state({ 
    name: 'search', 
    url: '/search?q', 
    //... 
} 

КОНТРОЛЛЕР ОТ:

function fromCtrl ($state) { 
    $state.go('search', {q: vm.searchTerms}); 
} 

CONTROLLER К:

function toCtrl ($state) { 
    vm.searchTerms = $state.params.q || ''; 
} 

Если searchTerms является объектом, вы можете использовать JSON.stringify() и JSON.parse()


Проверить эти сообщения, если вы все еще есть какие-либо сомнений:
How to extract query parameters with ui-router for AngularJS?
AngularJS: Pass an object into a state using ui-router

+0

спасибо за ссылки тоже – user3125823