AngularJS:分页 - 恢复导航

时间:2018-04-09 12:48:42

标签: angularjs

我创建了一个页面,其中有2个部分( 2个控制器和2个视图)。

左侧的部分包含类别( category_selector ),右侧部分显示左侧部分中所选类别中的项目( category_item_display )。

单个类别中有许多项目,因此在 category_item_display 中实施分页。
分页的工作原理是加载20个项目,然后显示一个按钮' Show More'如果该类别中有更多项目。单击该按钮将向页面添加另外20个项目。


单击某个项目时,页面将更改为项目详细信息页面,并显示项目详细信息。

现在问题就出现了。如果我点击“显示更多”'按钮一次或多次,然后在category_item_display中显示超过20个项目。但是,一旦我导航到项目详细信息页面然后单击后退按钮,控制器将再次加载并在category_item_display中仅显示20个项目。


所以我所做的是从URL参数" loaded_items'中检查要加载的项目数量。首先,如果没有找到,则选择默认值20。

网址搜索参数' loaded_items ='单击项目时添加到地址,然后更改地址。我通过在锚元素上同时使用 ng-ref ng-click 来实现这一点,因此ng-点击将首先执行,其中包含$ location.search(' loaded_items',count);
我不希望只要在“显示更多”内容中将加载的项目计数存储在网址中。单击,因为如果我选择另一个类别,则加载的项目将按此计数。

我想删除网址参数' loaded_items'在某个位置记录值后,在控制器初始化,以便列表可以退出。但$ location.search(' loaded_items',null);正在重新加载页面,因此加载的项目似乎是重复加载两次的项目。

我怎样才能做到这一点?


在此先感谢您 巴鲁

1 个答案:

答案 0 :(得分:0)

正如jbrown所说,我将这些项目添加到服务中。随之而来 ng-click call back会将所选项目ID添加到服务中。现在 当我单击后退按钮时,项目列表将不会更改,因为它 在服务中。在$anchorScroll中使用$timeout,屏幕即可 滚动到所选的确切项目(使用id )。

谢谢大家。