无法在 Ionic 1.3.0 iOS 应用程序中水平滚动

Question

我的 Cordova/Ionic (v1.3.0) 应用程序主要由一个 JQuery 应用程序组成，它为复杂的表单构建 HTML。同样的 JQuery 应用程序用于为 Web 浏览器构建复杂的表单，只有少数几个地方插入了特定于移动设备的代码。

我现在正在尝试在垂直滚动的表单中有一个水平滚动的 table 部分（表单本身不会水平滚动，只有 table 部分）。水平滚动部分在计算机 Safari/Chrome/Firefox、Safari iOS 和我们 Cordova/Ionic 应用程序的 Android 版本中有效，但它在iOS 应用程序。

我尝试了基于这些 SO 问题和文档的各种修复（q1,,q3,q4) where I changed it from a <div/> to <ion-content/> and added the overflow-scroll="true" direction="xy" delegate-handle="tableGroup" properties and called $ionicScrollDelegate.$getByHandle('tableGroup').resize() after the JQuery app loaded but nothing worked. I also tried using TinyScrollbar based on this question 但加载不正确。所以我尝试了很多方向但没有得到任何地方。有什么建议吗？

Answer 1

我实际上是自己想出来的。我在 Ionic 页面的容器中放置了几个简单滚动元素的变体，<ion-scroll/> 起作用了。然后我尝试将它放入带有委托句柄 sectionScroll 的 JQuery 应用程序中，并在 JQuery 应用程序加载后调用 $ionicScrollDelegate.$getByHandle('sectionScroll').resize(); 但收到控制台警告说找不到任何名为 sectionScroll 的东西，我应该把它放在 $timeout() 中。我试过了，但还是没用。然后我意识到，由于 <ion-scroll/> 是一个 angular 指令，它是作为使用 JQuery 插入 Ionic 应用程序的长模板字符串的一部分创建的，它需要由 [=20= 编译] 识别如下：

let toCompile = angular.element('#formContent');
let linkFn = $compile(toCompile);
linkFn($scope);
$ionicScrollDelegate.$getByHandle('sectionScroll').resize();

无法在 Ionic 1.3.0 iOS 应用程序中水平滚动

Can't horizontally scroll in Ionic 1.3.0 iOS App

horizontal-scrolling

ios

cordova

ionic-framework