CODEWITHSUNDEEP
angulartypescript
POV
POV

Reputation: 12025

How to disable FormControl in Reactive Form Angular?

How to disable this formControl:

this.step1 = this.fb.group({
      'name': ['', [Validators.required, Validators.minLength(1), Validators.maxLength(50)], disabled: true]...

I tried to add:

disabled: true

Upvotes: 1

Views: 1314

Answers (3)

PeS
PeS

Reputation: 4039

You must add that to formState - 1st parameter of fb.control:

this.step1 = this.fb.group({
  'name': this.fb.control({value: '', disabled: true}, [Validators.required, Validators.minLength(1), Validators.maxLength(50)])
});

Upvotes: 1

Krishna Rathore
Krishna Rathore

Reputation: 9687

use disabled:true for this.

this.step1 = this.fb.group({
      name: [{value:'name',disabled:true}, [Validators.required, Validators.minLength(1), Validators.maxLength(50)]],
      lastname: [{value:'last name',disabled:true}, [Validators.required, Validators.minLength(1), Validators.maxLength(50)]]
})

Upvotes: 1

user4676340
user4676340

Reputation:

I'm not sure this works 

'name': [{
  value: '',
  disabled: true
}, [Validators.required, Validators.minLength(1), Validators.maxLength(50)], disabled: true]

But I am sure this does 

'name': new FormControl([{
  value: '',
  disabled: true,
  validators: [Validators.required, Validators.minLength(1), Validators.maxLength(50)], disabled: true]
})

Upvotes: 3

Related Questions