19

I have an input field and a button. It must be disable at start. When the input no blank is, the button is enable.

I use a ngModel to take the value of the input and a function (change) to start a function each time the input is changed.

Now I do a little if in the change function.

if(input !== ''){
//enable the button
}else{
//disable the button
}

Have you any idea how to achieve that?

Thanks

1 Answer 1

61

Just have a boolean variable in class:

isenabled:boolean=false;

Change function

if(input !== ''){
//enable the button
isenabled=true; 
}else{
//disable the button
isenabled=false;
}

In Html:

<button ion-button [disabled]="!isenabled"></button>

For changing classes:

<button ion-button [ngClass]="{class:isenabled,class2:!isenabled}"></button>

Check here

2
  • It answers my question which was clumsily asked. But how can I add or remove a class using the same system? I need not a enable or disable the button, but have a link blue ou grey regarding to the context!
    – anubis
    Feb 3, 2017 at 13:28
  • Template parse errors: Parser Error: Unexpected token !, expected identifier, keyword, or string at column 27 in [{isenabled: disableButton,!isenabled:
    – anubis
    Feb 3, 2017 at 13:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.