docs(tab)

This commit is contained in:
mhartington
2015-12-03 17:41:46 -05:00
parent 2e99da4928
commit 3e473b494e

View File

@@ -9,6 +9,16 @@ import {Tabs} from './tabs';
/**
* @name Tab
* @usage
* ```html
* <ion-tabs>
* <ion-tab tab-title="Home" tab-icon="home" [root]="tabOneRoot"></ion-tab>
* <ion-tab tab-title="Login" tab-icon="star" [root]="tabTwoRoot"></ion-tab>
* </ion-tabs>
* ```
*
* @description
* _For basic Tabs usage, see the [Tabs section](../../../../components/#tabs)
* of the Component docs._
*
@@ -21,36 +31,12 @@ import {Tabs} from './tabs';
*
* See the [Tabs API reference](../Tabs/) for more details on configuring Tabs
* and the TabBar.
*
* Like Nav, you must set a root page to be loaded initially for each Tab with
* the 'root' property:
* ```
* import {GettingStartedPage} from 'getting-started';
* @App({
* template: `<ion-tabs>
* <ion-tab [root]="tabOneRoot"></ion-tab>
* <ion-tab [root]="tabTwoRoot"></ion-tab>
* <ion-tabs>`
* })
* class MyApp {
* constructor(){
* this.tabOneRoot = GettingStartedPage;
* this.tabTwoRoot = GettingStartedPage;
* }
* }
* ```
* <h3 id="tab_properties">Tab Properties</h3>
* The Tabs component automatically creates the TabBar from the properties you
* set on each Tab.
*
* To change the title and icon, use the `tab-title` and `tab-icon`
* inputs:
* ```html
* <ion-tabs>
* <ion-tab tab-title="Home" tab-icon="home" [root]="tabOneRoot"></ion-tab>
* <ion-tab tab-title="Login" tab-icon="star" [root]="tabTwoRoot"></ion-tab>
* <ion-tabs>
* ```
* @property [root] - set the root page for this tab
* @property [tab-title] - set the title of this tab
* @property [tab-icon] - set the icon for this tab
*/
@Component({
selector: 'ion-tab',
@@ -148,6 +134,9 @@ export class Tab extends NavController {
});
}
/**
* @private
*/
setSelected(isSelected) {
this.isSelected = isSelected;
this.hideNavbars(!isSelected);
@@ -163,10 +152,27 @@ export class Tab extends NavController {
});
}
/**
*
* ```ts
* export class MyClass{
* constructor(tab: Tab){
* this.tab = tab;
* console.log(this.tab.index);
* }
* }
* ```
*
* @returns {Number} Returns the index of this page within its NavController.
*
*/
get index() {
return this.parent.getIndex(this);
}
/**
* @private
*/
onDestroy() {
clearTimeout(this._loadTimer);
}