Question

我在用angularJs制作的离子滚动元素中有2个表：

<ion-view>
     <ion-scroll class="has-header has-footer" scrollbar-y="false" direction="y">
         <div ng-controller="calendCtrl" >
            <div id="t1" class="CSSTableGenerator" >
                <table class="planner" isolateScrolling>
                     <tr ng-repeat="row in calendarData track by $index">
                        <td colspan="{{day.colspan}}" title="{{day.title}}" 
                            ng-class="day.class" 
                            ng-click="calendarCellClick($parent.$index,$index)"  
                            ng-repeat="day in row track by $index">
                             {{day.descr}}
                        </td>
                    </tr>
                </table>
            </div>

            <div id="t2" class="CSSTableGenerator" >
                <table class="planner" isolateScrolling>
                     <tr ng-repeat="row in calendarData track by $index">
                        <td colspan="{{day.colspan}}" title="{{day.title}}" 
                            ng-class="day.class" 
                            ng-click="calendarCellClick($parent.$index,$index)"  
                            ng-repeat="day in row track by $index">
                             {{day.descr}}
                        </td>
                    </tr>
                </table>
            </div>

         <div>
    </ion-scroll>
</ion-view>

这2个表真的很长，所以我需要两个溢出滚动，但我需要一个离子滚动来查看表。

在Chrome浏览器上如果我在鼠标指针位于第一个表格时滚动，我可以滚动第一个表格，但离子滚动元素也会滚动。

在Safari上，在iPad上我只能滚动离子滚动视图，但我不能对表格做同样的事情。

我该如何管理？

更新1

在Firefox＆amp; Chrome上，stopPropagation指令解决了双滚动行为，但iPad上的表仍无法解析。

更新2

我在长形式的选择输入元素中滚动iPad有同样的问题，我可以滚动表单而不是选择。

Answer 1

Ionic 1.2修复了错误的浏览器滚动世界中的很多错误。

使用从凉亭安装的1.2.4，现在一切都工作得很好。

对我来说唯一不起作用的是属性scrollbar-y="false"，它不会隐藏滚动条。

下表是css：

table.planner {
    overflow-y: auto; 
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
}

它也可以在Safari iPad2上使用overflow-y: scroll;。

当我滚动表格元素

1 个答案: