所以我有一个看起来像这样的表格。每个输入字段都相同,因此无需发布所有241个字段。
我的问题是我无法通过类似formData.general_information_first_name
之类的内容访问from值,因为它返回""什么都没有。
即使符合要求,我的所有字段都将无效。
<ion-content>
<form #formData="authForm" (submit)="onSubmit(authForm.value)">
<ion-item-group>
<!-- <button light block >{{'HOME | translate'}}</button> -->
<ion-item-divider light>{{'INFORMATION_TO_COMPLETE_LOAN_APPLICATION' | translate}}</ion-item-divider>
<ion-item>
<ion-label fixed="first_name">{{'FIRST_NAME' | translate}}</ion-label>
<ion-input ngControl="general_information_first_name" type="text" value=""></ion-input>
</ion-item>
</ion-content>
我对应的.ts文件
import {Component} from "@angular/core";
import {TranslatePipe} from "ng2-translate/ng2-translate";
import {FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators, AbstractControl} from '@angular/common';
import {CustomValidators} from './custom-validators';
@Component({
templateUrl: 'build/pages/us-loan/us-loan.html',
pipes: [TranslatePipe],
directives: [FORM_DIRECTIVES]
})
export class UsCitizenPage {
authForm: ControlGroup;
general_information_first_name: AbstractControl;
constructor(private fb: FormBuilder) {
this.authForm = this.fb.group({
'general_information_first_name': ['', Validators.compose([Validators.required, CustomValidators.onlyLetters])]
});
this.general_information_first_name = this.authForm.controls['general_information_first_name'];
}
onSubmit(formData) {
console.log('Form submitted is ', formData);
debugger;
if(this.authForm.valid) {
console.log('Submitted value: ', formData);
debugger;
}
}
我的角度和离子版本信息:
{
"dependencies": {
"@angular/common": "2.0.0-rc.3",
"@angular/compiler": "2.0.0-rc.3",
"@angular/core": "2.0.0-rc.3",
"@angular/http": "2.0.0-rc.3",
"@angular/platform-browser": "2.0.0-rc.3",
"@angular/platform-browser-dynamic": "2.0.0-rc.3",
"es6-shim": "^0.35.0",
"ionic-angular": "2.0.0-beta.10",
"ionic-native": "1.3.2",
"ionicons": "3.0.0",
"ng2-translate": "^2.2.2",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.6",
"zone.js": "^0.6.12"
},
"devDependencies": {
"del": "2.2.0",
"gulp": "^3.9.1",
"gulp-uglify": "^2.0.0",
"gulp-watch": "4.3.5",
"ionic-gulp-browserify-typescript": "2.0.0",
"ionic-gulp-fonts-copy": "^1.0.0",
"ionic-gulp-html-copy": "^1.0.0",
"ionic-gulp-sass-build": "^1.0.0",
"ionic-gulp-scripts-copy": "^2.0.0",
"run-sequence": "1.1.5"
},
}