AngularJS reloadOnSearch 不起作用 [英] AngularJS reloadOnSearch not working

问题描述

在执行搜索并导航离开后，我希望用户能够返回搜索页面(通过在浏览器中回击)并保留当前的搜索参数.我已经意识到为了做到这一点，必须更新页面 url 以包含有关页面的数据.通过研究，我发现我可以使用 $location 更新位置，并在路线中使用 reloadOnSearch 进行更改时强制页面不重新加载.但是，由于某种原因，当我更改搜索参数 (url?...) 时，页面实际上会重新加载.知道如何修复它以防止重新加载吗?

After performing a search and navigating away i want the user to be able to return to the search page (by hitting back in the browser) and retain the current search parameters. I've come to realize that in order to do this, the pages url must be updated to contain data about the page. With research i found i can update the location using $location and force the page NOT to reload when a change is made by using reloadOnSearch in the routes. However, for some reason when i change the search parameters (url?...) the page in fact does reload. Any idea of how to fix it to prevent reloading?

routes.coffee:

'use strict'

angular.module('app.rc.routes', ['ui.router'])
  .config ['$stateProvider', '$urlRouterProvider', ($stateProvider, $urlRouterProvider) ->
    $urlRouterProvider.otherwise '/'
    $stateProvider
      ...
      .state('resource_center.search',
        url: '/resources/search?term'
        templateUrl: 'views/rc/search.html'
        controller: 'SearchCtrl'
        reloadOnSearch: false
      )
      ...
  ]

search.coffee:

'use strict'
angular.module('app.rc.controllers').controller 'SearchCtrl', ['$scope', '$state', '$http', '$stateParams', '$location', ($scope, $state, $http, $stateParams, $location) ->
  $scope.term = $stateParams.term || ''
  $scope.updateResults =  ->
    console.log "Loading Results"
    ...
    $location.search({term: $scope.term})

参考:

作为如何正确执行此操作的参考，我使用的是:https://stackoverflow.com/a/12481175/1382588

As a reference to how to properly do this, I was using: https://stackoverflow.com/a/12481175/1382588

推荐答案

reloadOnSearch 目前不支持 ui-router

reloadOnSearch isn't currently supported by ui-router

https://github.com/angular-ui/ui-router/问题/367

您应该能够通过两种状态在 ui-router 中做您想做的事情:搜索页面状态和搜索结果子状态.

You should be able to do what you want to do in ui-router by having two states: a search page state, and a search results child state.

例如搜索将位于/search，搜索结果位于/search/{query}.搜索页面将有一个显示搜索框的视图，以及一个显示搜索结果的嵌套视图.搜索按钮将对搜索结果状态进行状态更改.将导致搜索结果嵌套视图更新，而不会改变搜索页面的外观.

search will be at /search for example, and search results at /search/{query}. The search page will have a view to display the search box, and a nested view to display the search results. The search button will do a state change to the search results state. The will cause the search results nested view to update, without changing the appearance of the search page.

这篇关于AngularJS reloadOnSearch 不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！