1

我已經使用離子的聊天應用程序。離子內容是可滾動的。 我做了一個指令「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); 
     } 
    }; 
}) 

我無法理解爲什麼滾動會在離子內容中失效。幫助任何人。另外在離子含量我的控制器和IM使用點擊事件,這會縮小鍵盤,

$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(); 
} 

這裏是我的離子含量聊天應用的截圖 enter link description here

回答

0

嘗試將凍結設置爲false。

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

看看是否能工程