l'interface utilisateur du routeur question ionique cadre de l'appel de vues

Question

J'ai une application dans ionique cadre à l'aide des onglets exemple, pour la plupart.Toutefois, dans l'un des points de vue, je veux que l'utilisateur puisse cliquer sur un élément et aller dans un autre point de vue sur ce point.

Cependant, chaque fois que vous cliquez sur un élément, il charge la vue correcte, mais ne pas appeler le fichier de modèle de ce point de vue.

Voici ce que j'ai dans mon routeur (note sections non pertinentes sont laissés de côté)

$stateProvider.state('tab', {
  url: "/tab",
  abstract: true,
  templateUrl: "templates/tabs.html"
}).state('tab.dash', {
  url: '/dash',
  views: {
    'tab-dash': {
      templateUrl: 'templates/tab-dash.html',
      controller: 'LoginController'
    }
  }
}).state('tab.friend-detail', {
  url: '/friend/:friendId',
  views: {
    'tab-friends': {
      templateUrl: 'templates/friend-detail.html',
      controller: 'FriendDetailCtrl'
    }
  }
}).state('tab.buy', {
  url: '/buy',
  views: {
    'tab-buy': {
      templateUrl: 'templates/buy.html', 
      controller: 'PaymentController'
    }
  }
}).state('tab.account', {
  url: '/account',
  views: {
    'tab-account': {
      templateUrl: 'templates/tab-account.html',
      controller: 'AccountController'
    }
  }
}).state('tab.order', {
  url: '/account/order/:id', 
  views: {
    'tab-order': {
      templateUrl: 'templates/order-view.html', 
      controller: 'OrderController'
    }
  }
})

$urlRouterProvider.dans le cas contraire('/onglet/tableau de bord');

Dans mon contrôleur, j'ai:

$scope.viewOrder = function(id) {   
    $state.go('tab.order', {id:id});
};

Dans templates/tab-account.html j'ai:

<ion-view title="Account">
<ion-content class="has-header padding">
<h1>Account</h1>

<h2>Your orders</h2>

<div class="card" ng-repeat="booking in bookings">
  <div class="item item-text-wrap">
    <b><a ng-click="viewOrder(booking.id)">{{ booking.carpark.city }}</a></b> on <b>{{ booking.date | date:'dd.mm.yyyy' }}</b>
  </div>
</div>

Ensuite, le point de vue spécifique est comme suit:

<ion-view title="Order">
  <ion-content class="has-header padding">
      <h1>Your Order</h1>
      <p>Test</p>
      Order #: {{orderNumber}}
  </ion-content>
</ion-view>

Ce dernier point de vue essentiellement n'apparaît pas, même si l'url change de tab/account pour /tab/account/order/1

J'ai demandé à quelques StackOverflow questions concernant ionique récemment, toutes mes excuses si les gens continuent à venir à travers eux et à très juste titre, penser que je suis un idiot :/

Merci à l'avance!

Answer 1

Vous avez besoin d'un ui-view dans votre vue de la base.Lorsque vous imbriquez des états, l'affichage imbriqué est affiché à l'intérieur de la vue de base partout où vous disposez d'une interface utilisateur affichage de l'élément: <div ui-view></div>.