离子框架滚动列表中的问题



我正在使用离子框架的简单列表视图,它在某些设备和某些设备中工作正常,它隐藏了滚动条。用户在某些设备中根本无法滚动。许多用户都面临着同样的问题,他们在这里进行了讨论。

重现相同的问题

创建应用

ionic start scrollTest sidemenu

- 将"播放列表Ctrl"控制器修改为:

.controller('PlaylistsCtrl', function($scope) {
    $scope.playlists = [
      { title: 'Reggae', id: 1 },
      { title: 'Chill', id: 2 },
      { title: 'Dubstep', id: 3 },
      { title: 'Indie', id: 4 },
      { title: 'Rap', id: 5 },
      { title: 'Cowbell', id: 6 },
      { title: 'Breaks', id: 7 },
      { title: 'Jungle', id: 8 },
      { title: 'Drum & Bass', id: 9 },
      { title: 'Classics', id: 10 },
      { title: 'Blah', id: 11 },
      { title: 'Foo', id: 12 },
      { title: 'Bar', id: 13 },
      { title: 'House', id: 14 },
      { title: 'Trance', id: 15 },
      { title: 'EDM', id: 15 },
      { title: 'Country', id: 16 },
      { title: 'Rock', id: 17 }
    ];
  }) 

- 在播放列表中将溢出滚动设置为 true.html:

<ion-content class="has-header" overflow-scroll="true">...

- 在设备上启动应用程序:

ionic run android

。一旦启动,初始化视图(播放列表)就不会滚动...

任何人都可以帮助我解决这个问题,这将是很棒的,因为如果不解决此错误,我们就无法启动应用程序。

使用这个离子 js:

<script src="//code.ionicframework.com/nightly/js/ionic.bundle.min.js"></script>

删除溢出滚动="true"

<ion-content class="has-header" overflow-scroll="true">

在应用中添加此代码.js

if(ionic.Platform.isAndroid())
    $ionicConfigProvider.scrolling.jsScrolling(false);     

例如:

angular.module('ionicApp', ['ionic']).config(function($ionicConfigProvider)   {
    if (ionic.Platform.isAndroid())
       $ionicConfigProvider.scrolling.jsScrolling(false);
     })

上面的代码与溢出滚动="true"做同样的事情。 它使用本机滚动而不是 jsScroll

就我而言,在ios8-9(和safari)中滚动的唯一方法是使用离子滚动而不是离子内容:

<ion-scroll scrollbar-y="false" direction="y" style="height:92%">

在我看来,此属性是必需的。没有它,这个技巧是行不通的。另一件事..注意选项data-tap-disabled="true",它可以写在元素的某些父元素中。

必须将其删除或设置为 false:

data-tap-disabled="true"
在离子滚动上,属性溢出滚动不存在

,属性滚动设置为 true。

最新更新