javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 04:14:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

forms wip

Browse Source
This commit is contained in:
Tim Lancina
2015-06-23 11:29:12 -05:00
parent d030d9e136
commit fded55b679
3 changed files with 121 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
ionic/components/checkbox/test/basic/index.js
View File

@ -1,25 +1,87 @@
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {FormBuilder, Validators, formDirectives} from 'angular2/forms';
import {View} from 'angular2/src/core/annotations_impl/view';
import {IonicView} from 'ionic/ionic';
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
} from 'angular2/forms';
import {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;
// }
// }
@Component({ selector: 'ion-app' })
@IonicView({
@View({
templateUrl: 'main.html',
directives: [formDirectives]
directives: [Checkbox, List, Content, NgControlName, NgFormModel]
})
class IonicApp {
constructor() {
var fb = new FormBuilder();
this.fruitsForm = fb.group({
appleCtrl: ['', Validators.required],
bananaCtrl: ['', Validators.required],
grapeCtrl: ['', Validators.required],
cherryCtrl: ['', Validators.required]
});
debugger;
}
// 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 = new Control("APPLE", isChecked);
// this.bananaCtrl = new Control("BANANA", isChecked);
// this.grapeCtrl = new Control("GRAPE", isChecked);
// this.cherryCtrl = new Control("CHERRY", isChecked);
function isChecked(ctrl) {
if (ctrl.checked) {
return null;
} else {
return {
'notChecked': true
}
}
}
}
doSubmit(event) {
console.log('Submitting form', this.fruitsForm.value);
@ -27,6 +89,7 @@ class IonicApp {
}
}
export function main(ionicBootstrap) {
ionicBootstrap(IonicApp);
}