Question 217194 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Angular: Disable button in template if all values in array are false

Im looking for a simple yet efficient way to achieve this in template.

The code is as follows:

studentArray = Array<boolean>;

<button class="btn btn-success" 
[disabled]="" 
click="generateMarksheet()">
Generate Marksheet 
</button>

This button should remain disabled if every value in studentArray is false. How can I achieve this?

Tags:

2

Answers


  1. 0

    In my opinion the easiest way to achieve this is to create a method in your ts file that will check if all the values are false.

    For example :

    private youArr: boolean[];

public areAllValuesFalse(): boolean {
  return this.youArr.every(element => element === false)
}

    You can then bind the method in your template :

    <button class="btn btn-success" 
   [disabled]="areAllValuesFalse()" 
   click="generateMarksheet()">
   Generate Marksheet 
</button>

    Note : If you want to check for falsy values, you can then use !element instead of element === false

    Login or Signup to reply.
  2. 0

    If you want to do it in the Template it could look like this:

    <button class="btn btn-success" 
   [disabled]="!studentArray.includes(true)" 
   click="generateMarksheet()">
   Generate Marksheet 
</button>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search