Skip to content

Commit 420e83a

Browse files
antonmoiseevmhevery
authored andcommitted
feat(forms): add the submitted flag to NgForm and NgFormModel directives
Closes angular#2960 Closes angular#7449
1 parent 89f6108 commit 420e83a

4 files changed

Lines changed: 61 additions & 0 deletions

File tree

‎modules/@angular/common/src/forms/directives/ng_form.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,8 @@ export const formDirectiveProvider: any =
8686
exportAs: 'ngForm'
8787
})
8888
export class NgForm extends ControlContainer implements Form {
89+
private _submitted: boolean = false;
90+
8991
form: ControlGroup;
9092
ngSubmit = new EventEmitter();
9193

@@ -96,6 +98,8 @@ export class NgForm extends ControlContainer implements Form {
9698
composeAsyncValidators(asyncValidators));
9799
}
98100

101+
get submitted(): boolean { return this._submitted; }
102+
99103
get formDirective(): Form { return this; }
100104

101105
get control(): ControlGroup { return this.form; }
@@ -158,6 +162,7 @@ export class NgForm extends ControlContainer implements Form {
158162
}
159163

160164
onSubmit(): boolean {
165+
this._submitted = true;
161166
ObservableWrapper.callEmit(this.ngSubmit, null);
162167
return false;
163168
}

‎modules/@angular/common/src/forms/directives/ng_form_model.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,8 @@ export const formDirectiveProvider: any =
107107
})
108108
export class NgFormModel extends ControlContainer implements Form,
109109
OnChanges {
110+
private _submitted: boolean = false;
111+
110112
form: ControlGroup = null;
111113
directives: NgControl[] = [];
112114
ngSubmit = new EventEmitter();
@@ -131,6 +133,8 @@ export class NgFormModel extends ControlContainer implements Form,
131133
this._updateDomValue();
132134
}
133135

136+
get submitted(): boolean { return this._submitted; }
137+
134138
get formDirective(): Form { return this; }
135139

136140
get control(): ControlGroup { return this.form; }
@@ -166,6 +170,7 @@ export class NgFormModel extends ControlContainer implements Form,
166170
}
167171

168172
onSubmit(): boolean {
173+
this._submitted = true;
169174
ObservableWrapper.callEmit(this.ngSubmit, null);
170175
return false;
171176
}

‎modules/@angular/common/test/forms/integration_spec.ts‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -145,6 +145,55 @@ export function main() {
145145
expect(fixture.debugElement.componentInstance.name).toEqual('updated');
146146
})));
147147

148+
it("should mark NgForm as submitted on submit event",
149+
inject([TestComponentBuilder], fakeAsync((tcb: TestComponentBuilder) => {
150+
var t = `<div>
151+
<form #f="ngForm" (ngSubmit)="data=f.submitted"></form>
152+
<span>{{data}}</span>
153+
</div>`;
154+
155+
var fixture: ComponentFixture<MyComp8>;
156+
157+
tcb.overrideTemplate(MyComp8, t).createAsync(MyComp8).then(
158+
(root) => { fixture = root; });
159+
tick();
160+
161+
fixture.debugElement.componentInstance.data = false;
162+
163+
tick();
164+
165+
var form = fixture.debugElement.query(By.css("form"));
166+
dispatchEvent(form.nativeElement, "submit");
167+
168+
tick();
169+
expect(fixture.debugElement.componentInstance.data).toEqual(true);
170+
})));
171+
172+
it("should mark NgFormModel as submitted on submit event",
173+
inject([TestComponentBuilder], fakeAsync((tcb: TestComponentBuilder) => {
174+
var t = `<div>
175+
<form #f="ngForm" [ngFormModel]="form" (ngSubmit)="data=f.submitted"></form>
176+
<span>{{data}}</span>
177+
</div>`;
178+
179+
var fixture: ComponentFixture<MyComp8>;
180+
181+
tcb.overrideTemplate(MyComp8, t).createAsync(MyComp8).then(
182+
(root) => { fixture = root; });
183+
tick();
184+
185+
fixture.debugElement.componentInstance.form = new ControlGroup({});
186+
fixture.debugElement.componentInstance.data = false;
187+
188+
tick();
189+
190+
var form = fixture.debugElement.query(By.css("form"));
191+
dispatchEvent(form.nativeElement, "submit");
192+
193+
tick();
194+
expect(fixture.debugElement.componentInstance.data).toEqual(true);
195+
})));
196+
148197
it("should work with single controls",
149198
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
150199
var control = new Control("loginValue");

‎tools/public_api_guard/public_api_spec.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -801,6 +801,7 @@ const COMMON = [
801801
'NgForm.path:string[]',
802802
'NgForm.removeControl(dir:NgControl):void',
803803
'NgForm.removeControlGroup(dir:NgControlGroup):void',
804+
'NgForm.submitted:boolean',
804805
'NgForm.updateModel(dir:NgControl, value:any):void',
805806
'NgFormControl',
806807
'NgFormControl.asyncValidator:AsyncValidatorFn',
@@ -830,6 +831,7 @@ const COMMON = [
830831
'NgFormModel.path:string[]',
831832
'NgFormModel.removeControl(dir:NgControl):void',
832833
'NgFormModel.removeControlGroup(dir:NgControlGroup):any',
834+
'NgFormModel.submitted:boolean',
833835
'NgFormModel.updateModel(dir:NgControl, value:any):void',
834836
'NgIf',
835837
'NgIf.constructor(_viewContainer:ViewContainerRef, _templateRef:TemplateRef<Object>)',

0 commit comments

Comments
 (0)