角UI路由器刷新控制器上的后退按钮preSS [英] Angular UI Router Reload Controller on Back Button Press

问题描述

我有一个可以有许多可选的查询参数的路线：

I have a route that can have numerous optional query parameters:

$stateProvider.state("directory.search", {
                url: '/directory/search?name&email',
                templateUrl: 'view.html',
                controller: 'controller'

当用户填写表单搜索目录功能在 $范围更改状态导致控制器重新加载：

When the user fills the form to search the directory a function in the $scope changes the state causing the controller to reload:

 $scope.searchDirectory = function () {
            $state.go('directory.search', {
                name: $scope.Model.Query.name,
                email: $scope.Model.Query.email
            }, { reload: true });                   
        };

在有条件的控制器我有：如果（$ state.params）{返回数据} 是否发号施令还是不是我的服务将被查询。

In the controller I have a conditional: if($state.params){return data} dictating whether or not my service will be queried.

除非用户点击布劳尔的前进和/或后退按钮这个伟大的工程。在这两种情况下的状态（路线）改变正确的查询参数，但不会重新加载控制器。

This works great except if the user clicks the brower's forward and/or back buttons. In both these cases the state (route) changes the query parameters correctly but does not reload the controller.

这是我读过的控制器将重新加载只有当实际路线的变化。反正有使这个例子只能使用查询参数工作，或者我必须使用改变路线？

From what I've read the controller will be reloaded only if the actual route changes. Is there anyway to make this example work only using query parameters or must I use a changing route?

推荐答案

您应该听取了成功的页面更改，$ locationChangeSuccess事件。结帐的文档为它 https://docs.angularjs.org/api/ng/service/ $位置。

You should listen to the event for succesful page changes, $locationChangeSuccess. Checkout the docs for it https://docs.angularjs.org/api/ng/service/$location.

有也回答了所以这里检测历史回到了类似的问题采用了棱角分明

在该事件触发，你可以把你的页面加载运行任何逻辑，你需要在控制器初始化运行。

When that event fires you could put whatever logic you run on pageload that you need to run when the controller initializes.

是这样的：

$rootScope.$on('$locationChangeSuccess', function() {
    $scope.searchDirectory()
});  

或者更好的设置，如：

Or better setup like:

var searchDirectory = function () {
    $state.go('directory.search', {
        name: $scope.Model.Query.name,
        email: $scope.Model.Query.email
    }, { reload: true });

$scope.searchDirectory = searchDirectory;

$rootScope.$on('$locationChangeSuccess', function() {
    searchDirectory();
});  

这篇关于角UI路由器刷新控制器上的后退按钮preSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！