离子内容滚动被禁用答案

【问题标题】：Ionic content scroll is disabled离子内容滚动被禁用
【发布时间】：2016-06-09 08:03:28
【问题描述】：

我已经使用 ionic 制作了聊天应用程序。离子内容是可滚动的。我制定了一个指令“focus-on-keyboard-open”，当用户点击键盘时，移动键盘会打开，并且在离子内容中滚动向下。当用户在键盘外单击时，键盘会向下并再次向下滚动。问题是当我关闭键盘时，离子内容中的滚动变为禁用，我必须刷新视图以使离子内容再次可滚动。这是html代码

<ion-content id="{{conversationId}}" on-scroll="onChatScroll(10)" delegate-handle="chat-convo-handle" class="has-header main-bg lg-chat-bg" ng-click="keyboardhide()">
    ....
    </ion-content>
    <ion-footer-bar class="custom-lg-bar lg-br-top sb-bg" keyboard-attach>
    <textarea id="txtbox1" ng-keyup="keyup()" ng-keydown="keydown()" ng-blur="blur()" ng-change="change()" class="lg-text-area sb-bg" rows="1" msd-elastic ng-model="$root.chatFactory.msg_txt" placeholder="Type your message..." data-emojiable="true" focus-on-keyboard-open hidekeyboard="hidekeyboard"></textarea>
    </ion-footer-bar>

该指令用于文本区域。这是我的指令代码。

.directive('focusOnKeyboardOpen', function($window, $ionicScrollDelegate, $timeout) {
    'use strict';
    return {
        restrict: 'A',
        scope: {
            hidekeyboard: '=hidekeyboard'
        },
        link: function(scope, element, attrs) {
            var keyboardOpen = false;
            // require cordova plugin https://github.com/driftyco/ionic-plugins-keyboard
            $window.addEventListener('native.keyboardshow', function(e) {
                keyboardOpen = true;
                element[0].focus();
                $timeout(function() {
                    $ionicScrollDelegate.$getByHandle('chat-convo-handle').scrollBottom(true);
                    $ionicScrollDelegate.$getByHandle('comment-handle').scrollBottom(true);
                    $ionicScrollDelegate.$getByHandle('post-comment-handle').scrollBottom(true);
                }, 0);

            });
            $window.addEventListener('native.keyboardhide', function(e) {
                keyboardOpen = false;
                // if (scope.hidekeyboard) {
                element[0].blur();
                // }

            });



            element[0].addEventListener('blur', function(e) {
                if (scope.hidekeyboard) {
                    keyboardOpen = false;
                    scope.hidekeyboard = false;
                } else {
                    if (keyboardOpen) {
                        element[0].focus();
                    }
                }


            }, true);
        }
    };
})

我无法理解为什么在 ionic 内容中禁用滚动。帮助任何人。也在我的控制器中，我在关闭键盘的离子内容上使用点击事件，

$scope.hidekeyboard = false;
$scope.keyboardhide = function() {
    $ionicScrollDelegate.$getByHandle('chat-convo-handle').resize();
    $ionicScrollDelegate.$getByHandle('chat-convo-handle').scrollBottom(true);
    $scope.hidekeyboard = true;
    cordova.plugins.Keyboard.close();
}

这是我的 ionic 内容聊天应用程序的屏幕截图

【问题讨论】：

标签： javascript android angularjs angularjs-directive ionic-framework

【解决方案1】：

尝试将冻结设置为 false。

$ionicScrollDelegate.$getByHandle('your-handle').freezeScroll(false);

看看有没有效果

【讨论】：