How to disable particular dynamic checkbox in angular 6?

Question

Kindly see the below object array.i am displaying all group description value along with checkbox. i m trying to disable B and C group but as values are coming dynamic, all checkbox values are getting disabled.how can i disable particular group checkbox here.

[{groupId: "4", groupDesc: "A"},
 {groupId: "12", groupDesc: "B"},
 {groupId: "23", groupDesc: "c"},
 {groupId: "34", groupDesc: "D"}]


 for(var i=0;i<array.length;i++)
    {
         if(array[i].groupDesc == B || array[i].groupDesc == c)
            {
                 this.disablecheckbox = true;
            }
    }
<ng-container *ngFor="let value of array;let i = index;">
    <input type="checkbox" pattern="[0-9]{10}" [disabled]="disablecheckbox == true"  value="{{ value.GroupId }}" /><i class="skin"></i><span style ="width: 150px;">{{ value.groupDesc }}</span>
</ng-container>

Why are you using this? That's doesn't seems to be disabling the checkboxes — Eduardo Pascual Aseff
– Eduardo Pascual Aseff, Commented Feb 8, 2020 at 4:50
not related to your issue as I am not really familiar with Angular but instead of chaining all the or statements, you can do if ([‘A’, ‘B’, ‘C’, ‘D’].includes(array[i].groupDesc) ... — Arber Sylejmani
– Arber Sylejmani, Commented Feb 8, 2020 at 4:58

Prashant Pimpale · Accepted Answer · 2020-02-08 06:05:50Z

1

You can use a particular object from forEach to modify the property instead of local variable:

for(var i=0;i<array.length;i++)
{
    if(array[i].groupDesc == A || array[i].groupDesc == B || array[i].groupDesc == c || array[i].groupDesc == D)
    {
      array[i].disablecheckbox = true;
    }
}

HTML:

<ng-container *ngFor="let value of array;let i = index;">
    <input type="checkbox" pattern="[0-9]{10}" [disabled]="value.disablecheckbox"  value="{{ value.GroupId }}" /><i class="skin"></i><span style ="width: 150px;">{{ value.groupDesc }}</span>
</ng-container>

edited Feb 8, 2020 at 6:05

answered Feb 8, 2020 at 4:50

Prashant Pimpale

10.7k10 gold badges51 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

user3363946 Over a year ago

in this case also all checkbox will be disabled right.i need one B and C to be disabled

Prashant Pimpale Over a year ago

then why there is A and D in the if block? recheck your if condition!

user3363946 Over a year ago

if i remove also both will not disable at a time . it will take last value. so only D will be disabled

user3363946 Over a year ago

Hi I added Html Code as well. please help me out

Prashant Pimpale Over a year ago

@user3363946 Seem working here check this:stackblitz.com/edit/angular-g9fhzs

|

Collectives™ on Stack Overflow

How to disable particular dynamic checkbox in angular 6?

1 Answer 1

7 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Related