ionic实现部分内容滚动,以及滚动内容显示不完全的解决办法

ionic项目开发时,我们往往需要实现这么一个,上面标题等部分固定不动,下面的展示信息部分内容较多时实现滚动。

在ion-content内的部分默认是滚动的,但是我们不需要它全部内容滚动,应该怎么办呢?

1、先给ion-content加上属性scroll="false",如下图:


    ...

2、给需要滚动的部分外部加上,如下:


    ...
    
        ...
    

这样就完成了ionic的部分滚动,但是却会发现,ion-scroll部分的内容并没有显示完全,这时给ion-scroll添上style="height:100%",

会发现拉到底不拉不动的时候还是有好几条数据没有显示,看到网上有说在ion-scroll内部最后面加上:


    ...
     

然后再给loadMore()设置一下什么的,结果是:我的数据又多显示了几条,但是依然没有显示完全,该怎么办?

最后,我还是用了之前在其它地方用到的方法,在最后加一个
标签,就像这样:


    ...
     

这个xxx代表的数值就需要各位自己根据实际情况去尝试了,不断增加,直到能显示完全为止,不过这样会不会有新的问题,当我数据量进一步增加时,还能显示完全吗?经本人试验,依然可以显示完全,我用了两台手机以及模拟器上都可以完全显示,即使再添加数据也没问题。

不过,以上本人仅在Android上试验成功(没有试验ios的条件),有兴趣的可以在ios平台试验一下,看看是否能达到一样的效果。欢迎有试验过ios的,或者是ios有其他解决滚动内容显示不完全的办法进行评论告知,谢谢!

你可能感兴趣的:(cordova,ionic)