docs(tab): update tab docs

This commit is contained in:
mhartington
2016-02-02 15:50:37 -05:00
parent 35cb112e85
commit 8ed7da761f

View File

@ -12,14 +12,6 @@ import {TabButton} from './tab-button';
/** /**
* @name Tab * @name Tab
* @usage
* ```html
* <ion-tabs>
* <ion-tab tabTitle="Home" tabIcon="home" [root]="tabOneRoot"></ion-tab>
* <ion-tab tabTitle="Login" tabIcon="star" [root]="tabTwoRoot"></ion-tab>
* </ion-tabs>
* ```
*
* @description * @description
* _For basic Tabs usage, see the [Tabs section](../../../../components/#tabs) * _For basic Tabs usage, see the [Tabs section](../../../../components/#tabs)
* of the Component docs._ * of the Component docs._
@ -34,11 +26,12 @@ import {TabButton} from './tab-button';
* See the [Tabs API reference](../Tabs/) for more details on configuring Tabs * See the [Tabs API reference](../Tabs/) for more details on configuring Tabs
* and the TabBar. * and the TabBar.
* *
* @usage
* For most cases, you can give tab a `[root]` property along with the component you want to load. * For most cases, you can give tab a `[root]` property along with the component you want to load.
* *
* ```html * ```html
* <ion-tabs> * <ion-tabs>
* <ion-tab [root]="chatRoot"><ion-tab> * <ion-tab [root]="chatRoot" tabTitle="Chat" tabIcon="chat"><ion-tab>
* </ion-tabs> * </ion-tabs>
* ``` * ```
* *
@ -76,12 +69,12 @@ import {TabButton} from './tab-button';
* ``` * ```
* *
* *
* @property {any} [root] - set the root page for this tab * @property {Page} [root] - set the root page for this tab
* @property {any} [tabTitle] - set the title of this tab * @property {String} [tabTitle] - set the title of this tab
* @property {any} [tabIcon] - set the icon for this tab * @property {String} [tabIcon] - set the icon for this tab
* @property {any} [tabBadge] - set the badge for this tab * @property {Any} [tabBadge] - set the badge for this tab
* @property {any} [tabBadgeStyle] - set the badge color for this tab * @property {String} [tabBadgeStyle] - set the badge color for this tab
* @property {any} [select] - method to call when the current tab is selected * @property {Any} (select) - method to call when the current tab is selected
* *
*/ */
@Component({ @Component({
@ -95,6 +88,10 @@ import {TabButton} from './tab-button';
template: '<div #contents></div>' template: '<div #contents></div>'
}) })
export class Tab extends NavController { export class Tab extends NavController {
/**
* @private
*/
public isSelected: boolean; public isSelected: boolean;
private _isInitial: boolean; private _isInitial: boolean;
private _panelId: string; private _panelId: string;
@ -107,11 +104,35 @@ export class Tab extends NavController {
*/ */
btn: TabButton; btn: TabButton;
/**
* @private
*/
@Input() root: Type; @Input() root: Type;
/**
* @private
*/
@Input() tabTitle: string; @Input() tabTitle: string;
/**
* @private
*/
@Input() tabIcon: string; @Input() tabIcon: string;
/**
* @private
*/
@Input() tabBadge: string; @Input() tabBadge: string;
/**
* @private
*/
@Input() tabBadgeStyle: string; @Input() tabBadgeStyle: string;
/**
* @private
*/
@Output() select: EventEmitter<any> = new EventEmitter(); @Output() select: EventEmitter<any> = new EventEmitter();
constructor( constructor(
@ -156,6 +177,10 @@ export class Tab extends NavController {
} }
} }
/**
* @private
*/
preload(wait) { preload(wait) {
this._loadTimer = setTimeout(() => { this._loadTimer = setTimeout(() => {
if (!this._loaded) { if (!this._loaded) {
@ -212,18 +237,7 @@ export class Tab extends NavController {
} }
/** /**
* * @private
* ```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() { get index() {
return this.parent.getIndex(this); return this.parent.getIndex(this);