Hi,
I am trying to get form validation working and am having some issues.
Given the following example(s):
Scenario 1: Template Driven form, fields inline - THIS WORKS
<form *ngIf="resourceInstance" (ngSubmit)="onSubmit()" #riForm="ngForm">
Is valid {{riForm.form.valid}}
<input md-input *ngFor="let elementInstance of
resourceInstance.elementInstanceDtoList"
[(ngModel)]="elementInstance.value.strValue"
name="{{elementInstance.elementName}}"
#name="ngModel"
id="if_{{elementInstance.elementId}}"
class="demo-full-width" placeholder="Fill it"
required
style="width: 100%">
<button md-raised-button color="primary"
[disabled]="!riForm.form.valid">Create</button>
</form>
Scenario 2: Template driven form, fields in sub component - THIS DOES NOT
WORK
PARENT:
<form *ngIf="resourceInstance" (ngSubmit)="onSubmit()" #riForm="ngForm">
Is valid {{riForm.form.valid}}
<my-element-instance *ngFor="let elementInstance of
resourceInstance.elementInstanceDtoList"
[elementInstanceDto]="elementInstance">
</my-element-instance>
<button md-raised-button color="primary"
[disabled]="!riForm.form.valid">Create</button>
</form>
MY-ELEMENT-INSTANCE:
Component:
@Component({
selector: 'my-element-instance',
templateUrl: 'myElementInstance.component.html'
})
export class MyElementInstanceComponent {
@Input() elementInstance: ElementInstanceDto;
}
HTML:
<input md-input
[(ngModel)]="elementInstance.value.strValue"
name="{{elementInstance.elementName}}"
#name="ngModel"
id="if_{{elementInstance.elementId}}"
class="demo-full-width" placeholder="Fill it"
required
style="width: 100%">
If anyone can propose what is the correct way to resolve this problem it
would be appreciated. I don't really want to switch to reactive forms if I
can help it.
Thanks
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
