如何在AngularJS中更改路径时阻止视图重绘 [英] How to prevent view redraw when changing route in AngularJS
问题描述
我正在制作一个网络应用，用户可以在地图上查看对象，按标记并转到包含信息的新视图。从这个角度来看，他们可以更深入地了解更多信息。
I'm making a web app where users can view objects on a map, press a marker and go to a new view with information. From that view they can traverse deeper, into more information.
类似于：
- / map
- / tree / {treeid}
- / tree / {treeid} / information / {informationid}
我知道如何在路径/状态之间遍历时保持实际的模型状态。问题是当我回到浏览器历史记录时，我不想重新计算整个地图（带标记和所有内容）。换句话说，我希望在进一步遍历时保持/ map的渲染状态。
I know how to keep the actual model state when traversing between routes/states. The problem is that I don't want to recalculate the entire map (with markers and everything) when I go back in the browser history. In other words, I want to keep the rendered state of /map when traversing further.
这可以通过使用搜索参数而不是/ map上的路由来轻松实现（即./ map？treeid = 10）并在搜索时禁用重新加载，并在地图对象上执行ng-hide =treeid，在tree-info对象上执行ng-show。
This can easily be achieved by using search parameters instead of routes on /map (ie. /map?treeid=10) and disable reload on search, and doing ng-hide="treeid" on the map object and ng-show on the tree-info object.
我的问题是，是否有一种更好，更合适的角度来做这个？
My question is if there is a better, more appropiate way of doing this in angular?
谢谢你提前。
推荐答案
解决重新计算整个地图问题，解决此问题的一种方法是在与 ng-view 相同的级别，并将其移出视图以隐藏它。
Addressing your "recalculate the entire map" question, one way to resolve this is to draw the Google Map at the same level as your ng-view, and shift it out of the view to hide it.
这是一个plunker说明了这将如何工作：
http://plnkr.co/edit / wsjYoG2uXxYxXTmWdFGh？p =预览
Here is a plunker illustrating how this would work:
http://plnkr.co/edit/wsjYoG2uXxYxXTmWdFGh?p=preview
注意隐藏时我是如何故意将地图的一部分留在屏幕上以显示它在您更改时不会重绘路线。
Notice how I intentionally left a part of the map on screen when hiding to show that it does not redraw as you change the route.
这篇关于如何在AngularJS中更改路径时阻止视图重绘的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
