आयनिक, आईओएस

Question

पर कीपैड के ऊपर बटन रखें, मुझे खोले जाने पर कीपैड के ऊपर रहने के लिए इस पृष्ठ के निचले हिस्से में "ठीक" बटन चाहिए। यह एंड्रॉइड पर काम करता है जैसा कि आप बाईं ओर स्क्रीनशॉट में देख सकते हैं, लेकिन आईओएस (दाईं ओर स्क्रीनशॉट) में नहीं।

क्या आप कृपया कोड के साथ मेरी मदद कर सकते हैं?

इसके अलावा, जैसा कि आप "चयन-पर-फोकस" निर्देश देख सकते हैं, आईओएस में काम नहीं करता है ... और कीपैड को आईओएस पर न्यूमेरिक कीपैड (फोन पैड) होना चाहिए ... और ऐसा नहीं है।

<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 विशेषता निर्देश पर एक नज़र डालें।

कीबोर्ड-अटैचमेंट एक विशेषता निर्देश है जो कुंजीपटल दिखाते समय कुंजीपटल के ऊपर एक तत्व को फ़्लोट करने का कारण बनता है। वर्तमान में केवल आयन-फ़ूटर-बार निर्देश का समर्थन करता है।

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