Question

我有“搜索”按钮，它从休息服务返回对象数组。我使用ng-repeat将值推广到表中。现在，在点击colums时，我的页面会使用$routeprovider将详细信息导航到下一页。

我的问题是：当我点击浏览器后退按钮时，如何保留表中的值？

这是我的app.js：

myApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider
    .when('/displayValues', {
        templateUrl: 'DisplayValues.html',
        controller: 'DisplayValuesController'
    })
    .when('/showDetails/:inputNumber', {
        templateUrl: 'ShowDetails.html',
        controller: 'DetailsController'
    })
    .otherwise({
        redirectTo: '/displayValues'
    });
}]);

Answer 1

了解reloadOnSearch上的$routeProvider财产。如果设置为false，更改查询字符串值将不会导致控制器重新初始化，因此它们将维护状态（搜索结果）。

因此，如果导航到详细信息页面应使用查询字符串进行导航。要知道在这种情况下视图已更改，您必须订阅$routeUpdate事件。请参阅$ route documentation。

另一种方法是将搜索结果缓存到服务中，并在返回列表页面时重新绑定。

Answer 2

您可以通过服务保存状态，这些服务是AngularJs中的单例，可以通过依赖注入等方式访问。

你可以做一些简单的事情（这不是理想的，只是一个例子）：

angular.module('myApp', []).service('valueService', function() {
    var currentValues;

    return{
      setValues: function(newValues) {
        currentValues = newValues;
      },
      getValues: function() {
        return currentValues;
      }
    }
});

最初，您的控制器可以调用服务以获取数据，如果返回的值未定义，请对服务器执行XHR请求并将值存储在服务中。

您需要额外的逻辑和更改，但基本思路是将结果缓存到服务中并从控制器中检索。

如何在浏览器上保留从$ http返回的值

2 个答案: