AngularJS保持与不同的URL页面转换数据 [英] AngularJS maintain data on page transition with different URLs

查看:119
本文介绍了AngularJS保持与不同的URL页面转换数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是想了解我们如何能保持previous数据时跳到另一个网址,再回来。

I was trying to understand how we can maintain the previous data when jump to another URL and come back again.

我有一个单页的应用程序,让我们说第1页,在这里我有一个搜索框和搜索结果。有来的外部链接的搜索数据,如果用户点击该链接,URL变化和用户进入不同的页面。我怎样才能保持相同的结果数据,当用户想通过点击浏览器的后退按钮,再回到previous结果页面?

I have a single page application, let's say page1, where I have a search field and search result. There are come external links in the search data and if user clicks to that links, URL changes and user goes to different page. How can I maintain the same result data when the user wants to come back to the previous result page by hitting browser's back button?

推荐答案

请确保你所需要的页面显示在一个给定的状态是它的URL的一部分。让我们把你的例子:

Make sure all you need for a page to be displayed in a given state is part of its URL. Let's take your example:


  1. 搜索页面。最初是空的。 URL = /汽车

  2. 您填写的搜索表单和preSS搜索按钮。这种导航到网址 /汽车颜色=蓝色&放大器;年= 2015 。去这个网址改变了路线,路线搜索汽车,并将其显示在页面中。

  3. 您点击上车。这种导航到网址 /汽车/ 12345 。去这个网址改变了路线,路线装载车12345并将其显示在页面上。

  4. 您$​​ P $ PSS后退按钮。该导航回URL`/汽车颜色=蓝色&放大器;年= 2015。将这个URL改变路线,路径搜索汽车并在页面显示它们,再次

  1. Search page. Initially empty. URL = /cars
  2. You fill the search form and press the search button. This navigates to URL /cars?color=blue&year=2015. Going to this URL changes the route, and the route searches the cars and displays them in the page.
  3. You click on a car. This navigates to URL /cars/12345. Going to this URL changes the route, and the route loads the car 12345 and displays it in the page.
  4. You press the back button. This navigates back to URL `/cars?color=blue&year=2015. Going to this URL changes the route, and the route searches the cars and display them in the page, again.

总之,您的应用程序应该以同样的方式,如果它不是一个单页的应用程序,而且如果服务器使用的URL动态生成HTML页面。

In short, your app should work the same way as if it was not a single-page app, and if the server used the URL to generate a HTML page dynamically.

这篇关于AngularJS保持与不同的URL页面转换数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆