在Ionic中单个div内滚动

时间:2015-08-12 21:14:16

标签: javascript css angularjs ionic-framework ionic

我正在处理我的第一个Ionic应用程序,并且我遇到了在单个DIV中滚动工作的问题。我有一个YouTube搜索功能(代码从下面省略,因为它不相关 - 在注入或修改CSS后不触及div),并且它填充了遍布表格的youtubeDivSearch元素。但是,无论我尝试过什么,我都无法正常滚动工作。我已经尝试通过在填充后获取youtubeDivSearch的高度来设置离子滚动的高度,但即使它正确设置了CSS属性,它似乎在触发"反弹"之前向下滚动任意数量。阻止我进一步滚动的效果,并且没有设置高度它只是在没有任何实际滚动发生的情况下反弹到位。

我理解"滚动" +"离子"有几个问题,但我无法根据我搜索过的问题和我在SO上找到的方法找出具体的解决方案。

我仍然熟悉框架和AngularJS本身,所以如果有更好的方法来实现滚动,我很想知道 - 但也想知道为什么我现在的方法不工作我认为这是一个时间问题 - 但高度计算不是在异步中完成 - 它是在之后完成的 - 并且开始时感觉很难,所以我想完全改变方法。

我的标记在下面。感谢。

<ion-view view-title="Video" hide-nav-bar="true">
<ion-content scroll="false">
<div class="row">
  <div class="col">
  <ion-scroll>
  <div id="youtubeDivSearch" class="list"></div> 
  </ion-scroll>
  </div>
</div>
 </ion-content>
</ion-view>

1 个答案:

答案 0 :(得分:1)

我不知道你的项目和你的武器index.html如何,但这是正确的方法。你可以编辑我给的样式。

 <ion-scroll direction="y" style=" height: 500px">

codepen