離子框架選項卡作爲模板的子頁面

如何在離子框架中製作選項卡作爲單個頁面上的子項。我想創建主頁，當我在主頁中觸發下一個按鈕時，它將直接到標籤頁。這裏是標籤頁的父{標籤頁的login.html頁面的子}，這裏的login.html頁：離子框架選項卡作爲模板的子頁面

<ion-view view-title="Login"> 
    <ion-content > 
    <p> 
     <a class="button icon ion-home" href="#> Home</a> 
    </p> 
    </ion-content> 
</ion-view>

這裏是我的app.js：

// Ionic Starter App 

// angular.module is a global place for creating, registering and retrieving Angular modules 
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html) 
// the 2nd parameter is an array of 'requires' 
// 'starter.services' is found in services.js 
// 'starter.controllers' is found in controllers.js 
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services']) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
    // for form inputs) 
    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
    } 
    if (window.StatusBar) { 
     // org.apache.cordova.statusbar required 
     StatusBar.styleLightContent(); 
    } 
    }); 
}) 

.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('login',{ 
    url: '/login', 
    templateURL: "templates/login.html" 
    }) 

    .state('tab', { 
    parent: 'login', 
    url: "/tab", 
    abstract: true, 
    templateUrl: "templates/tabs.html" 
    }) 

    // Each tab has its own nav history stack: 

    .state('tab.dash', { 
    url: '/dash', 
    views: { 
     'tab-dash': { 
     templateUrl: 'templates/tab-dash.html', 
     controller: 'DashCtrl' 
     } 
    } 
    }) 

    .state('tab.chats', { 
     url: '/chats', 
     views: { 
     'tab-chats': { 
      templateUrl: 'templates/tab-chats.html', 
      controller: 'ChatsCtrl' 
     } 
     } 
    }) 
    .state('tab.chat-detail', { 
     url: '/chats/:chatId', 
     views: { 
     'tab-chats': { 
      templateUrl: 'templates/chat-detail.html', 
      controller: 'ChatDetailCtrl' 
     } 
     } 
    }) 

    .state('tab.account', { 
    url: '/account', 
    views: { 
     'tab-account': { 
     templateUrl: 'templates/tab-account.html', 
     controller: 'AccountCtrl' 
     } 
    } 
    }); 

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

});

來源

2015-04-25 Jais Anasrulloh Ja' fari

我想你非常接近。在login.html中將href屬性設置爲/tab。確保代碼中提到的所有模板都存在，否則角度將失敗。也許你也可以將$urlRouterProvider.otherwise('/tab/dash');的網址更改爲/login，以便用戶在打開應用程序時默認會看到登錄頁面。

來源

2015-04-26 04:28:43

它仍然不能工作:( –

離子框架選項卡作爲模板的子頁面

回答

相關問題