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/