1

我已经使用这个库https://github.com/alvarowolfx/ng-keypad实现了一个带有数字键的弹出框。当我单击输入字段时,会出现弹出框。但是,有时popover内容的位置不正确。你能帮我么。

这是我的html:

<script id="keypad-popover.html" type="text/ng-template">
  <ion-popover-view class="aiv-keypad">
    <ion-content overflow-scroll=false>
        <div class="ios">
            <ng-keypad on-key-pressed='onKeyPressed'>
                <ng-key ng-repeat='key in aivkeys' ng-key-data='key' ng-key-type='keypad.type'>{{key}}</ng-key>
                <!--<ng-key ng-key-type='keypad.type' ng-key-data="keypad.data">{{keypad.data}}</ng-key>-->
            </ng-keypad>
        </div>
    </ion-content>
  </ion-popover-view>
</script>

在控制器中,

$ionicPopover.fromTemplateUrl('keypad-popover.html', {
    scope: $scope,
    backdropClickToClose:false
}).then(function(popover) {
    $scope.keypad_popover = popover;
});

预期的,

在此处输入图像描述

有时会出现这个问题,

在此处输入图像描述

在此处输入图像描述

4

1 回答 1

0

虽然问题可以描述为溢出滚动,但overflow-scroll=false您使用的属性<ion-content>意味着您明确使用 Ionic scroll,它是transform3d()在 CSS 中用于实现滚动的。通常overflow-scroll=false是默认值。

如果您转动overflow-scroll=true元素,将使用“传统” overflow-y: autoCSS 规则而不是transform3d(). 对于弹出框,这通常足以解决您描述的问题。

scroll=false如果没有,您可以使用属性完全禁用元素的滚动。

于 2017-08-22T07:16:10.330 回答