AngularJS ui-router保存以前的状态

I want to save the current state, I don't mean saving url and params, I want to save the entire view with scopes.. In fact, I want to implement a facebook like search system, but differently. I want to display the results on the entire page, so I'll replace the current main State, and when the search bar will be cleared, then we will restore the previous state. I don't want to rebuild the state to restore the state instantly (no server requests) + to avoid complicated operations (eg. infinite scroll data..). I've found ui'router extras (sticky state) plugin, but we need to define what state to save with states definitions.. I apologize for my bad english..

我想保存当前状态,我不是说保存url和params,我想用范围保存整个视图..事实上,我想实现像搜索系统一样的facebook,但不同。我想在整个页面上显示结果,所以我将替换当前的主状态,当搜索栏被清除时,我们将恢复以前的状态。我不想重建状态立即恢复状态(没有服务器请求)+以避免复杂的操作(例如无限滚动数据..)。我已经找到了ui'router extras(粘性状态)插件,但是我们需要定义状态定义要保存的状态..我为我糟糕的英语道歉..

2 个解决方案

#1

You can save the date in the local storage using angular local storage. It will save you a trip to the server for data.

您可以使用角度本地存储将日期保存在本地存储中。它将为您节省数据服务器之旅。

#2

This is an architectural decision. The answer to this question will not be short and can be very subjective and different people will have different ways to implementing it.

这是一个架构决策。这个问题的答案不会很短,而且可能非常主观,不同的人会有不同的方式来实施。

What I would suggest is that you leverage local storage and do all actions on data present in local storage.

我建议您利用本地存储并对本地存储中存在的数据执行所有操作。

The way you would do this is to first understand that all server requests need to be done through A service that return what's present in localstorage is network is offline.

这样做的方法是首先要了解所有服务器请求都需要通过一个服务来完成,该服务返回localstorage中存在的网络离线。

So all AJAX calls will be done from the controller like this

所以所有AJAX调用都将从这样的控制器完成

var getMeRequest = AuthService.getMe();
getMeRequest.promise.then(function(response){ 
  if(response.cached) {
    // $update views if need be  
  } else {
    //Some code
  }
});

And in the AuthService file, you'd do it like this:

在AuthService文件中,您可以这样做:

// In AuthService

this.getMe() =  function () {
  if(network.online) {
    //Make AJAX call
    // Update localstorage with whatever response
    return {response: locastorageData, cached:false};
  } else {
    return {response: localstorageData, cached:true};
  }
  
};

This will not only let you make all the ajax calls as if you were online, but also allow the controller to update the view based on whether the response is cached or not.

这不仅可以让您像在线一样进行所有ajax调用,还可以让控制器根据响应是否被缓存来更新视图。

#1