Created
September 4, 2015 15:33
-
-
Save paulpatarinski/55c2e2973213d85d1aed to your computer and use it in GitHub Desktop.
MaYVgr
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html ng-app="ionicApp"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> | |
<title>Tabs Example</title> | |
<link href="http://code.ionicframework.com/1.1.0/css/ionic.min.css" rel="stylesheet"> | |
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.min.js"></script> | |
<script src="js/index.js"></script> | |
</head> | |
<body> | |
<ion-nav-bar class="bar-positive"> | |
<ion-nav-back-button> | |
</ion-nav-back-button> | |
</ion-nav-bar> | |
<ion-nav-view></ion-nav-view> | |
<script id="templates/tabs.html" type="text/ng-template"> | |
<ion-tabs class="tabs-icon-top tabs-positive "> | |
<ion-tab title="Home" icon="ion-home" href="#/tab/home"> | |
<ion-nav-view name="home-tab"></ion-nav-view> | |
</ion-tab> | |
<ion-tab title="About" icon="ion-ios-information" href="#/tab/about"> | |
<ion-nav-view name="about-tab"></ion-nav-view> | |
</ion-tab> | |
</ion-tabs> | |
</script> | |
<script id="templates/home.html" type="text/ng-template"> | |
<ion-view view-title="Home"> | |
<ion-header-bar> | |
<label class="title">Header Label</label> | |
</ion-header-bar> | |
<ion-content class="padding" has-header="true" > | |
<p>Tab 1 Content</p> | |
</ion-content> | |
</ion-view> | |
</script> | |
<script id="templates/about.html" type="text/ng-template"> | |
<ion-view view-title="About"> | |
<ion-content class="padding"> | |
<p> Tab 2 content</p> | |
</ion-content> | |
</ion-view> | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
angular.module('ionicApp', ['ionic']) | |
.config(function($stateProvider, $urlRouterProvider) { | |
$stateProvider | |
.state('tabs', { | |
url: "/tab", | |
abstract: true, | |
templateUrl: "templates/tabs.html" | |
}) | |
.state('tabs.home', { | |
url: "/home", | |
views: { | |
'home-tab': { | |
templateUrl: "templates/home.html", | |
controller: 'HomeTabCtrl' | |
} | |
} | |
}) | |
.state('tabs.about', { | |
url: "/about", | |
views: { | |
'about-tab': { | |
templateUrl: "templates/about.html" | |
} | |
} | |
}); | |
$urlRouterProvider.otherwise("/tab/home"); | |
}) | |
.controller('HomeTabCtrl', function($scope) { | |
console.log('HomeTabCtrl'); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment