CODEWITHSUNDEEP
angularformstypescript
Iñigo
Iñigo

Reputation: 2016

Get nested reactive form value in Angular?

I have a nested form similar to the following:

profileForm = new FormGroup({
  firstName: new FormControl(''),
  lastName: new FormControl(''),
  address: new FormGroup({
    street: new FormControl(''),
    city: new FormControl(''),
    date1: new FormControl(''),
    date2: new FormControl('')
  })
});

I'm trying to set the date2 mindate as date1 value like this:

<mat-form-field class="datepickerformfield" floatLabel="never">
    <input matInput class="dp" formControlName="date2" [min]="profileform.controls['date1'].value" [matDatepicker]="date2" placeholder="DD/MM/AAAA" >
</mat-form-field>

Also tried with:

[min]="profileform.address.controls['date1'].value"

And

[min]="profileform.controls[address].controls['date1'].value"

But I get an error:

Cannot read property 'value' of undefined

How can I get the date1 value with the profileform object?

Upvotes: 1

Views: 769

Answers (2)

Sebastian M&#252;nster
Sebastian M&#252;nster

Reputation: 575

The form has am member called value which is a reflection of your form structure but only including the values. To access the date you simply should call [min]="profileform.value.address.date1".

Upvotes: 0

I&#241;igo
I&#241;igo

Reputation: 2016

Finally solved with:

[min]="profileform.get('address.date1').value"

Working on Angular6+

Upvotes: 2

Related Questions