同一个标签中的后裔状态?

时间:2017-04-24 14:27:50

标签: angularjs ionic-framework

在我的Ionic应用程序中,我有一个显示人员列表的“主页”选项卡。这些列表项中的每一个都有两个按钮,一个用于联系它们,另一个用于显示有关它们的信息。

我希望实现的是每个按钮都会将用户带到该特定人员的联系人或信息页面,在同一个标​​签中(即主页标签仍然突出显示/选中,并且用户可以从左向右滑动以返回主页。

这样做的最佳方式是什么?

以下是我当前代码的相关摘要。

app.js

.state('tab.home', {
  url: '/home',
  views: {
    'tab-home': {
      templateUrl: 'templates/tab-home.html',
      controller: 'HomeCtrl'
    },
    // 'rep-contact': {
    //   templateUrl: 'templates/rep-contact.html',
    //   controller: 'RepContactCtrl'
    // }, 'rep-info': {
    //   templateUrl: 'templates/rep-info.html',
    //   controller: 'RepInfoCtrl'
    // }
  }
})

 ...

.state('rep-contact', {
  url: '/contact',
  // parent: 'tab.home',
  templateUrl: 'templates/rep-contact.html',
  controller: 'RepContactCtrl',
  params: {
    name: null
  }
})

controllers.js

.controller('HomeCtrl', function($scope, $state, $ionicViewSwitcher) {

...

  $scope.goToContactPage = function(name) {
    $ionicViewSwitcher.nextDirection('forward');
    $state.go('rep-contact', { name: name });
  };
})

tab-home.html列表项按钮(仅限联系按钮)

<button class="button button-balanced icon ion-ios-telephone button-contact float-right" ng-click="goToContactPage(rep.name)"></button>

1 个答案:

答案 0 :(得分:0)

试试这个:

    .state('tab.rep-contact', {
      url: '/contact',
      views: {
        'tab-home': {
           templateUrl: 'templates/rep-contact.html',
           controller: 'RepContactCtrl'
        },
      }
    })