我有一个项目我正在使用带有ui.router的angularJS,如果用户点击某个事件来查看详细信息,则会显示一个后退按钮但是在点击后面时,我们会有一个非常长的事件列表(具有无限滚动) div的滚动重置回顶部!寻找一些关于是否有内置的建议,我可以利用它来记住这个滚动位置,我知道这是锚定服务,但我想知道是否有更适合停止角度重置导航滚动位置的东西??因为有一些相似的列表需要记住他们滚动时的状态..我已经调查并试图实现ui-router-extras dsr和sticky但是两者都没有工作..
例如 http://codedef.com/hapzis_poc/.不是完整的证明,但应该能够向下滚动事件,点击并返回并保持在相同的滚动位置..
例如 http://codedef.com/hapzis_poc/.不是完整的证明,但应该能够向下滚动事件,点击并返回并保持在相同的滚动位置..
解决方法
关于类似主题(ng-view)的讨论和@ br2000给出的答案对我有用.
https://stackoverflow.com/a/25073496/3959662
要使他的指令适用于ui-router,请执行以下操作:
1.创建这样的新指令:
(function () { 'use strict'; angular .module('your.module.directives') .directive('keepScrollPos',keepScrollPos); function keepScrollPos($route,$window,$timeout,$location,$anchorScroll,$state) { // cache scroll position of each route's templateUrl var scrollPosCache = {}; // compile function var directive = function (scope,element,attrs) { scope.$on('$stateChangeStart',function () { // store scroll position for the current view if($state.$current) { scrollPosCache[$state.current.templateUrl] = [$window.pageXOffset,$window.pageYOffset]; } }); scope.$on('$stateChangeSuccess',function () { // if hash is specified explicitly,it trumps prevIoUsly stored scroll position if ($location.hash()) { $anchorScroll(); // else get prevIoUs scroll position; if none,scroll to the top of the page } else { var prevScrollPos = scrollPosCache[$state.current.templateUrl] || [0,0]; $timeout(function () { $window.scrollTo(prevScrollPos[0],prevScrollPos[1]); },0); } }); }; return directive; } })();
2.在我拥有ui-view属性的元素上使用它,在我的例子中:
<div class="col-xs-12" ui-view keep-scroll-pos></div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。