CODEWITHSUNDEEP
angular
LLaza
LLaza

Reputation: 379

how can I access to reactive formgroup validations?

I want to validate my form field, but I have a formgroup inside it like this:

<form novalidate (ngSubmit)="onSubmit(user)" [formGroup]="user">
      <label>
        <span>Full name</span>
        <input type="text" placeholder="Name" formControlName="name">
      </label>
      <div class="error" *ngIf="!user.controls.name.valid && user.controls.name.touched">
        Name is required
      </div>
      <div formGroupName="account">
        <label>
          <span>Email address</span>
          <input type="email" placeholder="Email" formControlName="email">
        </label>
        <div
          class="error"
          *ngIf="!user.controls.address.email.valid">
          Email is required
        </div>
        <button type="submit" [disabled]="user.invalid">Sign up</button>
    </form>

but at email field it is not working this

!user.controls.address.email.valid

how can I get if that field is valid or not to show the message?

Upvotes: 1

Views: 3329

Answers (2)

k11k2
k11k2

Reputation: 2044

Suppose my structure would be 

 this.UserForm = this.fb.group({
            id: [this.userobj.id], 
            addresses: this.fb.group({
                street: [this.addrssobj.street, Validators.required],            
            })
});

My addresses.street validation would be like this (html)

<div formGroupName="addresses">
            <div>
                <label class="center-block"> Street: </label>
                <input type="text" class="form-group" formControlName="street" required>
                <div *ngIf="UserForm.get('addresses').get('street').hasError('required') && UserForm.get('addresses').get('street').touched" class="text-danger">
                    Street is required
                </div>
            </div>

Upvotes: 0

DeborahK
DeborahK

Reputation: 60518

Try syntax like this:

user.get('account.email').valid

I have a complete example here: https://github.com/DeborahK/Angular2-ReactiveForms This is code from my Pluralsight course: Angular 2: Reactive Forms.

Upvotes: 4

Related Questions