Empty Variable Gives True Value To Disabled Attribute On Input

I dont know if this is a problem or normal behavior. If we have a form like this:

field1

Solution 1:

UPDATE

I found the answer to this in the angular source code (<3 open source!). The ngModel controller explicitly checks for '' when the disabled input is changed. If the input strictly equals '', the element will be disabled. So this behavior is by design.

Here is how to source code looks (link to GitHub, see line 142 and 217)

const isDisabled = disabledValue === '' || (disabledValue && disabledValue !== 'false');

This means that you cannot use an empty string as falsy to set an input that is using ngModel to disable it.

Here is how you get around it

<inputtype="text" name="field1" [(ngModel)]="mainVar" [disabled]="someVar ? true : false"  />

Working plunker example

Solution 2:

Set it to null/undefined/false, and it will not be disabled. String empty is still a value.

Share

You may like these posts

• 
  Angular 2 Focus On First Invalid Input After Click/event
• 
  Angular Binding To A Function On The View Results To Infinite Calls To The Data Service
• 
  Observable Of Component Attribute Changes In Angular2
• 
  Angular 2 And Amcharts