so here is the condition
I’m making multi template driven form, if satisfied then ionic-slide will trigger next.
which mean i had to pass the value of #currentForm="ngForm"
to the TS function submitForm(#currentForm)
then check if currentForm.valid
in the ts
problem is that, i cannot make any dynamic ID to pass in the function #anotherForm, #anotherForm2 because of angular syntax hence i must rewrite all other forms
do you have any sugestion how to make it DRY
i have an idea to submitForm($event)
and cast event as NgForm but cannot
<ion-slide >
<h2>{{this.vechileForm.title}}</h2>
<form class="ionContent" #idVechileForm="ngForm" (submit)="completionFormSubmit(idVechileForm)">
<ion-list *ngFor="let currentBaseForm of this.vechileForm.baseForms" >
<floating-input [parentForm]="idVechileForm" [baseForm]="currentBaseForm"></floating-input>
</ion-list>
<button ion-button="" type="button" (click)="slidePrevious()" color="light">Previous</button>
<button ion-button="" color="primary">Next</button>
</form>
</ion-slide>
<ion-slide >
<h2>{{hostForm.title}}</h2>
<form class="ionContent" #idHostForm="ngForm" (submit)="completionFormSubmit(idHostForm)">
<ion-list *ngFor="let currentBaseForm of hostForm.baseForms">
<floating-input [parentForm]="idHostForm" [baseForm]="currentBaseForm"></floating-input>
</ion-list>
<button ion-button="" type="button" (click)="slidePrevious()" color="light">Previous</button>
<button ion-button="" color="primary">Submit</button>
</form>
</ion-slide>
completionFormSubmit(form: NgForm) {
if (form.valid) {
this.slideNext();
for(var key in form.value){
console.log('sdfsdfdsfsd');
this.formValues[key] = form.value[key];
}
}
else {
this.alert("Field(s) is not valid");
}
}