mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
91 lines
2.4 KiB
TypeScript
91 lines
2.4 KiB
TypeScript
import {Component, View} from 'angular2/angular2';
|
|
|
|
import {Query, QueryList, NgFor} from 'angular2/angular2';
|
|
// import {FormBuilder, Validators, NgFormControl, Control, NgControlName, NgControlGroup, ControlContainer} from 'angular2/forms';
|
|
import {
|
|
Control,
|
|
ControlGroup,
|
|
NgForm,
|
|
formDirectives,
|
|
Validators,
|
|
NgControl,
|
|
ControlValueAccessor,
|
|
NgControlName,
|
|
NgFormModel,
|
|
FormBuilder
|
|
} from 'angular2/forms';
|
|
import {App, Checkbox, Content, List} from 'ionic/ionic';
|
|
//import {IONIC_DIRECTIVES} from 'ionic/ionic'
|
|
|
|
// @Component({
|
|
// selector: 'checkbox-wrapper',
|
|
// properties: [
|
|
// 'ctrl'
|
|
// ]
|
|
// })
|
|
// @View({ //TODO: Pass in component property as checkbox content?
|
|
// template: `<ion-checkbox [ng-form-control]="ctrl">
|
|
// {{ctrlname}}
|
|
// </ion-checkbox>`,
|
|
// directives: [IonicApp, Checkbox, NgFormControl]
|
|
// })
|
|
// class CheckboxWrapper{
|
|
// constructor(@Query(Checkbox, {descendants: true}) checkboxes: QueryList){
|
|
// this.checkboxes = checkboxes;
|
|
//
|
|
// //doesn't work
|
|
// this.checkboxes.onChange(this.onCheckboxChange);
|
|
// setTimeout(() => console.log(this.ctrlname));
|
|
//
|
|
// //setTimeout(() => this.onCheckboxChange(), 3000);
|
|
// }
|
|
//
|
|
// onCheckboxChange(val) {
|
|
// debugger;
|
|
// }
|
|
// }
|
|
|
|
@App({
|
|
templateUrl: 'main.html',
|
|
directives: [Checkbox, List, Content, NgControlName, NgFormModel]
|
|
})
|
|
class IonicApp {
|
|
constructor() {
|
|
// var fb = new FormBuilder();
|
|
// this.controls = {
|
|
// appleCtrl : ['', Validators.required],
|
|
// bananaCtrl: ['', Validators.required],
|
|
// grapeCtrl: ['', Validators.required],
|
|
// cherryCtrl: ['', Validators.required]
|
|
// };
|
|
//
|
|
// this.fruitsForm = fb.group(this.controls);
|
|
|
|
this.fruitsForm = new ControlGroup({
|
|
"appleCtrl": new Control("APPLE", isChecked),
|
|
"bananaCtrl": new Control("BANANA", isChecked),
|
|
"grapeCtrl": new Control("GRAPE", isChecked),
|
|
"cherryCtrl": new Control("CHERRY", isChecked)
|
|
});
|
|
this.appleCtrl = "appleCtrl";
|
|
this.bananaCtrl = "bananaCtrl";
|
|
this.grapeCtrl = "grapeCtrl";
|
|
this.cherryCtrl = "cherryCtrl";
|
|
|
|
function isChecked(ctrl) {
|
|
if (ctrl.checked) {
|
|
return null;
|
|
} else {
|
|
return {
|
|
'notChecked': true
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
doSubmit(event) {
|
|
console.log('Submitting form', this.fruitsForm.value);
|
|
event.preventDefault();
|
|
}
|
|
}
|