浏览器的后退按钮在 Angular 应用程序中没有刷新就不起作用答案

【问题标题】：Browser's back button doesn't work without refresh in Angular app浏览器的后退按钮在 Angular 应用程序中没有刷新就不起作用
【发布时间】：2014-10-06 12:58:23
【问题描述】：

我有一个 Angular 应用程序，它有几个 ng 控制器和几个模板。这是我的路由的 sn-p：

when('/claims', {
    templateUrl: '/angular_templates/index',
    controller: 'ClaimsController',
    resolve: {
        rootClaims: ['claimsCache', function (claimsCache) {
            return claimsCache.getResource(0);
        }]
    }
}).when('/claims/:id', {
    templateUrl: '/angular_templates/show',
    controller: 'ClaimController',

    resolve: {
        claim: ['$http', '$route', function ($http, $route) {
            return $http.get('/claims/' + $route.current.params.id + '.json').then(
                function (response) {
                    return response.data;
                },
                function (response) {
                    console.log(response.status);
                    return {};
                }
            );
        }]
    }
}).when('/tags/:id/claims_with_tag', {
    templateUrl: '/angular_templates/tag_claim.html',
    controller: 'TagController',
    resolve: {
        tag: ['$http', function ($http) {
            return $http.get('claims_with_tag.json').then(
                function (response) {
                    return response.data;
                },
                function (response) {
                    console.log(response.status);
                    return {};
                }
            );
        }]
    }
});

当我通过手动输入 URL 并按 Enter 键一一打开多个页面，然后按浏览器的后退按钮时 - 一切正常。但是，当我通过单击页面上的一些链接然后使用后退按钮从一个页面导航到另一个页面时，我可以在控制台中看到所有数据都已加载，查询已发送到服务器，但实际上没有显示 ng-content这页纸。页面刷新后所有加载正常。

我注意到另一个特点 - 后退导航不适用于仅首先打开的页面。例如，我手动输入第 1 页的地址，然后转到第 2 页、第 3 页，然后单击浏览器中的“后退”按钮 - 一切正常，直到我们到达第一页（本示例中的第 1 页）。进入第1页时，我可以在控制台中看到来自服务器的数据，但它没有显示在页面上。

有人知道这个问题的解决方案吗？

【问题讨论】：

在您的代码中添加 plnkr 或 jsfiddle 来解释问题。 ng-content 是什么？
ng-content - 它不是一个指令，我只是像这样调用由 Angular 加载的动态内容。例如，如果我有一个静态标题，它会在单击返回时加载，但属于 Angular 模板的所有内容 - 都不会加载。
你在 DOM 中使用什么来导航到第二条路线？
休闲链接和 $location.path.
这个问题的答案是什么？

标签： angularjs ruby-on-rails-3 angularjs-routing

【解决方案1】：

您需要订阅 Param 的 ActivatedRoute 并在每个组件中相应地处理流程，如下所示：

this.route.params.subscribe((params: Params)=>{
});

【讨论】：

这个问题是关于 [angularjs] (v1.x)，而不是 [angular] (v2+)。所以这个答案不应该在这里。

【解决方案2】：

当你从一个页面导航到另一个页面时，听众就消失了..

您似乎需要在导航到任何页面后重新附加按钮侦听器...

【讨论】：