离子,在iOS上的键盘上方保持按钮

Question

我需要本页底部的"确定"按钮,以便在打开时保持在键盘上方.它适用于Android,您可以在左侧的屏幕截图中看到,但不能在IOS中看到(右侧的屏幕截图).

你能帮我解决这个问题吗？

此外,你可以看到"选择焦点"指令在iOS中不起作用......键盘应该是iOS上的数字键盘(手机键盘)......而事实并非如此.

然后3个问题;)

这是一个视频:https: //youtu.be/_bOWGMGesgk

这是代码:

<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:

.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);
              });
            }

        }
      }
    })