ionic, iOS의 키패드 위 버튼 유지

Question

키패드를 열었을 때 키패드 위에 머물러있게하려면이 페이지 하단의 "OK"버튼이 필요합니다. 왼쪽의 스크린 샷에서 볼 수 있듯이 Android에서는 작동하지만 IOS (오른쪽 스크린 샷)에서는 볼 수 없습니다.

코드로 제발 도와 주실 수 있습니까?

더욱이 iOS에서는 "select-on-focus"지시문이 작동하지 않습니다 ... 그리고 키패드는 iOS의 숫자 키패드 (전화 패드)에 있어야하며 그렇지 않습니다.

<div class="wrapperFlex withNextButton"> 
<div class="itemTitle"> 
    <div class="text"> 
     {{'paramQuestions.weight' | translate }} 
    </div> 
</div> 

<div id="weightdata" class="itemParameters weightdataclass row"> 

    <input class="weightinput" type="number" name="userweight" ng-min="{{data.minWeight}}" ng-max="{{data.maxWeight}}" ng-model="data.realWeight" ng-change="updateViewGenVol(data.weightunit, data.userweight, data.BLfactorValue);saveUserWeight()" select-on-focus required></input> 
    <div class="weightunitradios"> 
     <ion-checkbox class="checkboxes checkbox-blueboardline" ng-model="data.weightunit" ng-true-value="'kg'" ng-false-value="'lbs'" ng-change="saveWeightUnit(); changeMinMax(); convertWeightInput(); saveUserWeight();">kg</ion-checkbox> 
     <ion-checkbox class="checkboxes checkbox-blueboardline" ng-model="data.weightunit" ng-true-value="'lbs'" ng-false-value="'kg'" ng-change="saveWeightUnit(); changeMinMax(); convertWeightInput(); saveUserWeight();">lbs</ion-checkbox> 
    </div> 
</div> 
</div> 

directives.js :

https://youtu.be/_bOWGMGesgk

다음

코드입니다 : 다음,

3 개 문제) 다음

은 비디오입니다 키보드/스크롤 문제에 대한

.directive('selectOnFocus', function ($timeout) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
      var focusedElement = null; 

      element.on('focus', function() { 
       var self = this; 
       if (focusedElement != self) { 
        focusedElement = self; 
        $timeout(function() { 
         self.select(); 
        }, 10); 
       } 
      }); 

      element.on('blur', function() { 
       focusedElement = null; 
      }); 
     } 
    } 
}) 

Answer 1

, 나는 (전용 iOS 용)이 지침보다 더 찾을 수 없습니다 :

.directive('keyboardResize', function ($ionicScrollDelegate) { 
     return { 
     restrict: 'A', 
     link: function postLink(scope, element, attrs) { 

      function onKeyboardShow (e) { 
       element.css('bottom', e.keyboardHeight + 'px'); 
       $ionicScrollDelegate.$getByHandle(attrs.delegateHandle).resize(); 
       console.log("ouiaaaaaaaaa") 
      }; 
      function onKeyboardHide (e) { 
       element.css('bottom', ''); 
       $ionicScrollDelegate.$getByHandle(attrs.delegateHandle).resize(); 
      }; 

      if (ionic.Platform.isIOS()) { 
       ionic.on('native.keyboardshow', onKeyboardShow, window); 
       ionic.on('native.keyboardhide', onKeyboardHide, window); 

       scope.$on('$destroy', function() { 
        ionic.off('native.keyboardshow', onKeyboardShow, window); 
        ionic.off('native.keyboardhide', onKeyboardHide, window); 
       }); 
      } 

     } 
     } 
    })  

Answer 2

이온 실제로 기본적으로이 기능을 지원합니다. keyboard-attach 속성 명령을 살펴보십시오.

keyboard-attach는 키보드가 나타날 때 요소가 키보드 위에 떠있는 특성 지시어입니다. 현재는 이온 푸터 바 지시문 만 지원합니다.

<ion-footer-bar align-title="left" keyboard-attach class="bar-assertive"> 
    <h1 class="title">Title!</h1> 
</ion-footer-bar> 

출처 : http://ionicframework.com/docs/api/directive/keyboardAttach/