mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
switch, tabs docs wip
This commit is contained in:
@@ -16,7 +16,9 @@ import {IonicConfig} from '../../config/config';
|
||||
import {IonicComponent, IonicView} from '../../config/annotations';
|
||||
import {pointerCoord} from '../../util/dom';
|
||||
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@Directive({
|
||||
selector: '.media-switch',
|
||||
host: {
|
||||
@@ -28,6 +30,12 @@ import {pointerCoord} from '../../util/dom';
|
||||
}
|
||||
})
|
||||
class MediaSwitch {
|
||||
/**
|
||||
* TODO
|
||||
* @param {Switch} swtch TODO
|
||||
* @param {} elementRef TODO
|
||||
* @param {IonicConfig} config TODO
|
||||
*/
|
||||
constructor(
|
||||
@Host() @Inject(forwardRef(() => Switch)) swtch: Switch,
|
||||
elementRef: ElementRef,
|
||||
@@ -105,6 +113,9 @@ class MediaSwitch {
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@IonicComponent({
|
||||
selector: 'ion-switch',
|
||||
properties: [
|
||||
@@ -133,10 +144,16 @@ class MediaSwitch {
|
||||
directives: [MediaSwitch]
|
||||
})
|
||||
export class Switch extends Ion {
|
||||
/**
|
||||
* TODO
|
||||
* @param {ElementRef} elementRef TODO
|
||||
* @param {IonicConfig} config TODO
|
||||
* @param {NgControl=} ngControl TODO
|
||||
*/
|
||||
constructor(
|
||||
elementRef: ElementRef,
|
||||
config: IonicConfig,
|
||||
@Optional() private cd: NgControl
|
||||
@Optional() private ngControl: NgControl
|
||||
) {
|
||||
super(elementRef, config);
|
||||
this.id = IonInput.nextId();
|
||||
@@ -145,7 +162,7 @@ export class Switch extends Ion {
|
||||
this.onChange = (_) => {};
|
||||
this.onTouched = (_) => {};
|
||||
|
||||
if (cd) cd.valueAccessor = this;
|
||||
if (ngControl) ngControl.valueAccessor = this;
|
||||
}
|
||||
|
||||
onInit() {
|
||||
@@ -153,11 +170,18 @@ export class Switch extends Ion {
|
||||
this.labelId = 'label-' + this.id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set checked state of this switch.
|
||||
* @param {boolean} value Boolean to set this switch's checked state to.
|
||||
*/
|
||||
check(value) {
|
||||
this.checked = !!value;
|
||||
this.onChange(this.checked);
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggle the checked state of this switch.
|
||||
*/
|
||||
toggle() {
|
||||
this.check(!this.checked);
|
||||
}
|
||||
|
||||
@@ -5,6 +5,9 @@ import {ViewItem} from '../view/view-item';
|
||||
import {Tabs} from './tabs';
|
||||
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@Component({
|
||||
selector: 'ion-tab',
|
||||
properties: [
|
||||
@@ -26,6 +29,13 @@ import {Tabs} from './tabs';
|
||||
})
|
||||
export class Tab extends ViewController {
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @param {Tabs} tabs TODO
|
||||
* @param {ElementRef} elementRef TODO
|
||||
* @param {Injector} injector TODO
|
||||
* @param {NgZone} zone TODO
|
||||
*/
|
||||
constructor(
|
||||
@Host() tabs: Tabs,
|
||||
elementRef: ElementRef,
|
||||
@@ -70,6 +80,10 @@ export class Tab extends ViewController {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @param {Function} callback TODO
|
||||
*/
|
||||
load(callback) {
|
||||
if (!this._loaded && this.root) {
|
||||
let opts = {
|
||||
@@ -86,6 +100,10 @@ export class Tab extends ViewController {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @returns {TODO} TODO
|
||||
*/
|
||||
queueInitial() {
|
||||
// this Tab will be used as the initial one for the first load of Tabs
|
||||
return new Promise(res => { this._initialResolve = res; });
|
||||
@@ -102,10 +120,19 @@ export class Tab extends ViewController {
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@Directive({
|
||||
selector: 'template[pane-anchor]'
|
||||
})
|
||||
class TabPaneAnchor {
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @param {Tab} tab TODO
|
||||
* @param {ElementRef} elementRef TODO
|
||||
*/
|
||||
constructor(@Host() tab: Tab, elementRef: ElementRef) {
|
||||
tab.anchorElementRef(elementRef);
|
||||
}
|
||||
|
||||
@@ -5,7 +5,9 @@ import {ViewItem} from '../view/view-item';
|
||||
import {Icon} from '../icon/icon';
|
||||
import {IonicComponent, IonicView} from '../../config/annotations';
|
||||
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@IonicComponent({
|
||||
selector: 'ion-tabs',
|
||||
defaultProperties: {
|
||||
@@ -64,6 +66,10 @@ export class Tabs extends ViewController {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @param {Tab} tab TODO
|
||||
*/
|
||||
addTab(tab) {
|
||||
// tab.item refers to the ViewItem of the individual Tab being added to Tabs (ViewController)
|
||||
// this.item refers to the ViewItem instsance on Tabs
|
||||
@@ -76,6 +82,11 @@ export class Tabs extends ViewController {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* TODO
|
||||
* @param {Tab} tab TODO
|
||||
* @returns {TODO} TODO
|
||||
*/
|
||||
select(tab) {
|
||||
let enteringItem = null;
|
||||
if (typeof tab === 'number') {
|
||||
@@ -112,6 +123,9 @@ export class Tabs extends ViewController {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* TODO
|
||||
*/
|
||||
@Directive({
|
||||
selector: 'button.tab-button',
|
||||
properties: ['tab'],
|
||||
|
||||
Reference in New Issue
Block a user