2015-07-30 1 views
1

Je construis une application mobile hybride avec Onsen UI et j'ai un problème avec la navigation et le transfert de données entre deux pages. Ma page d'accueil est index.html et contient un ons-template main.html et un ons-navigation et un élément ons-page à l'intérieur de l'autre. Le structrue du index.html est:OnsenUi getCurrentPage() donne un objet vide

<body> 
    <ons-sliding-menu main-page="main.html" menu-page="menu.html" side="left" type="reveal" var="menu"> 
    </ons-sliding-menu> 

    <ons-template id="main.html"> 
    <ons-navigator var="navi"> 
     <ons-page id="main-page" class="main-page" ng-controller="MainPage"> 
     </ons-page> 
    </ons-navigator> 
    </ons-template> 
</body> 

Je voudrais obtenir les données renvoyées de la recherche-city.html les options de la fonction popPage(), mais lorsque je tente d'obtenir l'objet currentPage du navigateur il me donne un objet de page vide sans nom et options.

Dans la console chrome:

Class {page: "", name: "", element: JQLite[1], pageScope: Object, options: Object…} 

Il est seulement vide quand il tente d'obtenir la page principale. Aussi quand je lance getPages() dans le contrôleur recherche-city.html, la première page est vide et la recherche-city.html est très bien:

Class {page: "search-city.html", name: "search-city.html", element: JQLite[1], pageScope: Object, options: Object…} 

J'essaie de renvoyer les données et naviguer de recherche-ville .html avec une méthode popPage():

navi.popPage({ animation: 'lift' , data: 'something'}); 

Et j'essaie d'obtenir les données dans le contrôleur de ma page principale avec un gestionnaire d'événements postpop:

navi.on('postpop', function(event) { 
    var page = navi.getCurrentPage(); 
    console.log('popped'); 
    console.log(page); 
}); 

le problème est que la page est vide comme je l'ai montré ci-dessus. Pourquoi ma page principale est-elle vide dans la pile de pages? Il est également vide après l'initialisation, en cours d'exécution getCurrentPage()

Est-ce que je fais quelque chose de mal? Y a-t-il un meilleur moyen de passer des objets entre les pages? Je préfère jQuery et je ne suis pas familier avec AngularJS.

Ceci est la documentation sur les modules de navigation: http://onsen.io/reference/ons-navigator.html#method-popPage

Désolé pour le long courrier.

Répondre

1

Je pense que si vous mettez votre ons-page principal directement dans le navigateur, cette page n'aura pas de nom (l'ID est quelque chose de différent) et ne sera pas possible de le lire dans l'objet currentPage. Vous pouvez juste nommer votre page principale et je pense que cela fonctionnera bien:

<ons-sliding-menu main-page="navigator.html" menu-page="menu.html" side="left" type="reveal" var="menu"> 
</ons-sliding-menu> 

<ons-template id="navigator.html"> 
    <ons-navigator var="navi" page=main.html> 
    </ons-navigator> 
</ons-template> 

<ons-template id="main.html"> 
    <ons-page id="main-page" class="main-page" ng-controller="MainPage"> 
    </ons-page> 
</ons-template> 

Espérons que ça aide!

+0

Nous vous remercions de votre réponse rapide! J'ai essayé votre conseil, cependant le problème est que mon 'var page = navi.getCurrentPage();' jette ** 'navi n'est pas défini' ** erreur, donc je ne peux pas atteindre mon navigateur. – Boldizsar

+0

Désolé, j'ai oublié de mettre main-page = "navigator.html" sur mon menu. Ça marche! Je vous remercie! – Boldizsar