2016-01-14 1 views
0

I m using Ionic to build an application. I m nouveau à Ionic et je voudrais de l'aide pour configurer mon point de vue.Ionic Affichage de plusieurs vues dans une seule page

mon application contient une vue abstraite principale qui contient l'en-tête principal

<script type="text/ng-template" id="main-view"> 
    <ion-header-bar class='bar bar-header bar-stable' align-title="center"> 
     <h3 class="title">Title</h3> 
    </ion-header-bar> 
    <ion-nav-view name="View-A"></ion-nav-view> 
    <ion-nav-view name="View-B"></ion-nav-view> 
</script> 

et une autre vue qui devait être comme un écran partagé. basiquement i`m essayant de montrer 2 vues sur la même page (avec différents contrôleurs)

c'est ma config:

.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
    // setup an abstract state for the tabs directive 
     .state('main', { 
      url: '/main', 
      abstract: true, 
      templateUrl: 'main-view' 
      } 

     }) 
    .state('main.inner', { 
     url: '/inner', 
     views: { 
      'View-A': { 
       templateUrl: "View-A", 
       controller: 'ViewACtrl' 
      }, 
      'View-B': { 
       templateUrl: 'View-B', 
       controller: 'ViewBCtrl' 
      } 
     } 
    }); 

    $urlRouterProvider.otherwise('/main/inner'); 

}) 

Les vues ressemblent à ce

<script type="text/ng-template" id="View-A"> 
    <ion-view> 
<-- DATA --> 
</ion-view> 
</script> 

<script type="text/ng-template" id="View-B"> 
    <ion-view> 
<-- DATA --> 
</ion-view> 
</script> 

Le problème est, que seule la deuxième vue est affichée. qu'est-ce que je fais mal?

Répondre

0

Essayez de remplacer

<ion-nav-view name="View-A"></ion-nav-view> 
<ion-nav-view name="View-B"></ion-nav-view> 

avec

<div ui-view="View-A"></div> 
<div ui-view="View-B"></div> 

EDIT

Il y a une possibilité d'utiliser cette library. Ajoutez 'ionicMultipleViews' à angular.module et cela devrait fonctionner.

+0

non, toujours le même résultat –

+0

ion-nav-view contient l'historique des transitions d'état et devrait être utilisé comme vue parent unique. Essayez plutôt la directive ion-view. –

+0

ok. J'ai vérifié cela et trouvé que ce n'est pas possible. Vous pouvez essayer cette extension https://github.com/alongubkin/ionic-multiple-views –