Question

是否可以将不同的标签链接到同一视图？现在我有：

<ion-tabs class="tabs-icon-top tabs-color-active-positive">

  <ion-tab title="Dashboard" icon-off="ion-ios-speedometer-outline" icon-on="ion-ios-speedometer" active="active.dashboard" >
    <ion-nav-view name="tab-app"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Reports" icon-off="ion-ios-pie-outline" icon-on="ion-ios-pie">
    <ion-nav-view name="tab-app"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Create" icon-off="ion-ios-plus" icon-on="ion-plus-circled" >
    <ion-nav-view name="tab-app"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Approvals" icon-off="ion-ios-bell-outline" icon-on="ion-ios-bell">
    <ion-nav-view name="tab-app"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Settings" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" href="#/tab/settings">
    <ion-nav-view name="tab-settings"></ion-nav-view>
  </ion-tab>

</ion-tabs>

但是，这些选项卡中的每一个都只是tab-app的不同实例，控制器会重新加载，并且它们不共享任何属性。

如何让标签共享相同的视图？我想将它们链接在一起，让控制器根据所选的任何选项卡进行操作。谢谢！

更新，添加路由：

.config(function($stateProvider, $urlRouterProvider) {

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider

  // setup an abstract state for the tabs directive
  .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html',
    controller: 'TabCtrl'
  })

  // Each tab has its own nav history stack:

  .state('tab.app', {
    url: '/app',
    params: {state_location: null},
    views: {
      'tab-app': {
        templateUrl: 'templates/tab-app.html',
        controller: 'AppCtrl'
      }
    }
  })

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/tab/app');

})

Answer 1

这与控制器共享数据基本相同。

您可以创建服务以在它们之间共享数据
您可以使用单个ui-view并在jonic angular API中添加和删除页面

将多个离子标签链接到同一视图？

1 个答案: