आईकोनिक पॉपओवर एक्सकोड सिम्युलेटर पर काम करता है लेकिन आईफोन

Question

पर मेरे पास मेरे ऐप पर एक आयनिक पॉपओवर नहीं है। पॉपओवर तब प्रकट होता है जब मैं आयनिक सेवा, आयनिक अनुकरण आईओएस, और एक्सकोड सिम्युलेटर चलाता हूं। हालांकि, जैसे ही मैं एक्सकोड पर अपने आईफोन 4 एस पर ऐप अनुकरण करता हूं या अपना खुद का एप्लीकेशन देखने के लिए आयनिक व्यू ऐप का उपयोग करता हूं, पॉपओवर दिखाई नहीं देता है। मैंने सब कुछ डीबग किया है और कोड काम नहीं करता है। ऐप चलाने पर मेरे कंसोल पर कोई त्रुटि नहीं दिखाई देती है।

एक बार नीले चंद्रमा में पॉपओवर मेरे 4 एस पर दिखाई देगा, लेकिन पॉपओवर कैसे दिखाई देता है इसके बारे में कोई तर्क नहीं है। मैं कोड का एक टुकड़ा बदलूंगा, पॉपओवर प्रकट होता है, फिर जब मैं इसे फिर से बदलता हूं, तो पॉपओवर गायब हो जाता है। मैं इस प्रक्रिया को दोहराता हूं और अपने पुराने कोड संस्करण पर वापस जाता हूं जो काम करता है और यह काम नहीं करता है। यह निराश करने वाला है। इससे भी बदतर मुझे डर है कि कोई भी इस संदेश का जवाब नहीं देगा। आईफोन सिम्युलेटर और मेरे वास्तविक आईफोन के बीच एक विसंगति क्यों है, इस बारे में कोई मदद बहुत अच्छी होगी। धन्यवाद।

बटन HTML

<div ng-controller="FilterPopoverController as filterPopover" class="text-right"> 
     <div on-tap="filterPopover.open()" ng-class="{filterButtonOpened: filterPopover.opened}" id="filter-button"> 
     <span class="assertive" > 
      <i class="icon ion-arrow-down-b"></i> 
      <span class="bold">FILTER</span> 
     </span> 
     </div> 
    </div> 

पॉपओवर एचटीएमएल

<ion-popover-view id="filterPopover"> 
    <ion-header-bar class="bar-dark"> 
    <h1 id="popoverTitle" class="bold">FILTER BY</h1> 
    </ion-header-bar> 

    <ion-content> 
    <p>Content here</p> 
    </ion-content> 
</ion-popover-view> 

पॉपओवर नियंत्रक

.controller('FilterPopoverController', filterPopoverController) 

filterPopoverController.$inject = ['$ionicPopover', '$filter', '$scope', '$timeout']; 

function filterPopoverController($ionicPopover, $filter, $scope, $timeout) { 
    var vm = this; 

    vm.open = open; 

    vm.popover = null; 

    vm.opened = false; 

    activate(); 

    //Cleanup the popover when we're done with it! 
    $scope.$on('$destroy', function() { 
    vm.popover.remove(); 

    vm.opened = false; 
    }); 

    $scope.$on('popover.hidden', function() { 
    vm.opened = false; 
    }); 

    function activate() { 
    $ionicPopover.fromTemplateUrl('/templates/search/filter-popover.html', { 
     scope: $scope 
    }).then(function(popover) { 
     vm.popover = popover; 
    }); 
    } 



    function open() { 
     vm.opened = true; 

     vm.popover.show(); 
    } 
} 

मैं इस कोड में से कुछ से संवेदनशील जानकारी को हटाने के लिए मिला है, लेकिन इस सार है इसका

Answer 1

मैं अपनी पोस्ट कोड को दो संशोधनों बना दिया है:

'templates/search/filter-popover.html' 

बजाय

'/templates/search/filter-popover.html' 

आपको यह फ़ाइल को संदर्भित करने की जरूरत है: पहले एक पॉपओवर टेम्पलेट के मार्ग बदलने के लिए हो रहा है रूट निर्देशिका के बजाय वर्तमान निर्देशिका से शुरू

दूसरा बदलना $event इनपुट खोलने के दौरान पास करना है पॉपओवर, इस ionic Popover

की आधिकारिक दस्तावेज से है पोस्ट कोड के लिए इन परिवर्तनों के दोनों को लागू करने के बाद, मैं डेस्कटॉप ब्राउज़र, ios सिम्युलेटर पर पॉपओवर, वास्तविक iPhone 4 consistenly देखने के लिए

यहाँ अंतिम कोड है प्रबंधन:

angular.module('starter', ['ionic']) 
 

 
.run(function($ionicPlatform) { 
 
    $ionicPlatform.ready(function() { 
 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
 
    // for form inputs) 
 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
 
    } 
 
    if(window.StatusBar) { 
 
     StatusBar.styleDefault(); 
 
    } 
 
    }); 
 
}) 
 

 
.controller('FilterPopoverController', filterPopoverController) 
 

 
filterPopoverController.$inject = ['$ionicPopover', '$filter', '$scope', '$timeout']; 
 

 
function filterPopoverController($ionicPopover, $filter, $scope, $timeout) { 
 
    var vm = this; 
 

 
    vm.open = open; 
 

 
    vm.popover = null; 
 

 
    vm.opened = false; 
 

 
    activate(); 
 

 
    //Cleanup the popover when we're done with it! 
 
    $scope.$on('$destroy', function() { 
 
    vm.popover.remove(); 
 

 
    vm.opened = false; 
 
    }); 
 

 
    $scope.$on('popover.hidden', function() { 
 
    vm.opened = false; 
 
    }); 
 

 
    function activate() { 
 
    $ionicPopover.fromTemplateUrl('templates/search/filter-popover.html', { 
 
     scope: $scope 
 
    }).then(function(popover) { 
 
     vm.popover = popover; 
 
    }); 
 
    } 
 

 

 

 
    function open($event) { 
 
     vm.opened = true; 
 

 
     vm.popover.show($event); 
 
    } 
 
}

<div ng-controller="FilterPopoverController as filterPopover" class="text-right"> 
 
    <div on-tap="filterPopover.open($event)" ng-class="{filterButtonOpened: filterPopover.opened}" id="filter-button"> 
 
    <span class="assertive" > 
 
     <i class="icon ion-arrow-down-b"></i> 
 
     <span class="bold">FILTER</span> 
 
    </span> 
 
    </div> 
 
</div>

मुझे आशा है कि यह आपकी समस्या नहीं सुलझती।