Link in Navbar mit dynamischen Popup, framework7

Question

Ich benutze eine "Fixed" Style-Layout-Seite mit einer Navbar in meiner Hauptseite, die ich auch gerne in einem Popup verwenden würde. In meiner Hauptseite funktioniert alles gut und ich kann Links/Icons in der Navbar verwenden, um bestimmte Ereignisse auszulösen. Beim Kopieren der gleichen Struktur in ein Popup kann ich jedoch keine Ereignisse auslösen.

In meiner Haupt-Seite, wo alle HTML funktionieren:

<div class="views"> 
    <div class="view view-main"> 
    <div class="pages"> 
     <div data-page="index" class="page navbar-fixed toolbar-fixed"> 
    <!-- Top Navbar--> 
    <div class="navbar"> 
     <div class="navbar-inner"> 
     <div class="center">Hello</div> 
     <div class="right"> 
      <a href="" class="navbarIcon"> 
      <i class="f7-icons">add_round</i> 
      </a> 
     </div> 
    </div> 
    </div> 
    <!-- /End of Top Navbar--> 

    <div class="page-content" > 
     <div class="content-block"> 
     ... 

ich unter JS verwenden kann ein Ereignis auf einem Klick auf Basis auszulösen:

$$('.navbarIcon').on('click', function (e) { 
console.log("Hello"); 
}); 

Wenn für ein die gleiche Struktur mit Dynamisches Popup Ich kann keine Ereignisse auslösen. Das Popup-HTML ist:

Ich würde erwarten, dass der gleiche JS-Code ausgelöst wird, indem diese Navbar im Popup hat, aber nichts passiert. Ich kann in der Konsole sehen, dass die Klasse navbarIcon tatsächlich aktiv wird, aber immer noch nichts den JS-Code auslöst. Wenn ich der Klasse ein "close-popup" hinzufüge, schließt das Popup, aber sonst nichts

Ich habe versucht, das Schließen/Schließen des Popup zu fangen, aber dies führt auch zu keiner Antwort in der JS. Ich habe versucht, dies mit:

$$('.popup-stats').on('popup:opened', function() { 
console.log('About Popup opened') 
}); 
$$('.popup-stats').on('popup:close', function() { 
console.log('About Popup is closing') 
}); 
$$('.popup-stats').on('popup:open', function() { 
console.log('Services Popup is opening') 
}); 
$$('.popup-stats').on('popup:closed', function() { 
console.log('Services Popup is closed') 
}); 
$$('.close-popup').on('click', function() { 
console.log('Services Popup is closed') 
}); 

Jede Idee, wie ich das beheben kann dies, so kann ich das Popup-Schließung fangen und über die Links in der Navigationsleiste verwenden?

Ich kann auch hinzufügen, dass ich versuchte, von einem dynamischen Popup auf eine dynamische Seite mit den gleichen Ergebnissen zu wechseln.

Answer 1

Solange die neuen Elemente dynamisch geladen werden, wird erwartet, dass Sie auf diese Weise verwenden, um Ereignisse zu hören:

$$(document).on('popup:closed', '.popup-stats', function() { 
    console.log('Services Popup is closed'); 
}); 

Vergessen Sie auch nicht die Codes innerhalb der onPageInit Funktion der aktuellen Seite schließen Das hat das Popup.

Answer 2

Ok, ein Teil der Antwort ist gefunden! Ich habe meine Ereignislistener vor dem Popup in DOM hinzugefügt. So, jetzt kann ich die JS auslösen:

$$('.close-popup').on('click', function() { 
console.log('Services Popup is closed') 
}); 

und

$$('.navbarIcon').on('click', function (e) { 
console.log("Hello"); 
}); 

Durch sie direkt nach den myApp.popup(popupHTML);

Platzierung Allerdings habe ich nicht in der Lage gewesen, die 'popup:close' und 'popup:closed' Ereignisse auszulösen.

Irgendwelche Ideen?