首页 文章

带有ng-show和粘滞状态的ng-infinite-scroll

提问于
浏览
2

我是棱角分明的新人 . 在我的单页Web应用程序中,我有两个选项卡,每个选项卡都有ng-infinite-scroll . 使用导航栏在两个标签之间移动,

<div ng-show="$state.includes('base.videolist')||$state.includes('base.movielist')  ">
<ul class="nav navbar-fixed-top roboto nav-tabs">
   <li ui-sref="base.videolist" ui-sref-active="active"><a>Videos</a></li>
   <li ui-sref="base.movielist" ui-sref-active="active"><a>Movies</a></li>
</ul>
</div>

每个标签位于两个ui视图中,如下所示 .

<div id="bvl" ui-view="videolist" ng-show="$state.includes('base.videolist')"></div>
<div id="bml" ui-view="movielist" ng-show="$state.includes('base.movielist')"></div>

使用ng-show时,隐藏div的高度按角度设置为0 . 从而无限地触发无限滚动 .

我不想使用ng-if因为我想维护列表的滚动状态 .

怎么办呢?

PS . 我为这两个列表使用粘性状态来维护列表元素的主详细信息视图之间的状态 .

1 回答

  • 2

    来自https://sroze.github.io/ngInfiniteScroll/documentation.html

    infinite-scroll-disabled(可选) - - 一个布尔表达式,当为true时,表示即使满足所有其他条件,也不应评估无限滚动表达式 .

    如果你想使用ng-show =“showIt”隐藏包含无限滚动的元素,你可以添加infinite-scroll-disabled =“!showIt”来阻止它在隐藏时尝试加载更多项目 .

    这是一个带有2个无限滚动div的jsbin example,每个都可以用ng-show隐藏,而不会隐藏无限滚动,每次滚动时都会尝试加载更多项目 .

相关问题