How to remove duplicate value in an array Angular 2

Question

I have checkbox (with selected value by user, checked ). So I need to edit this checkbox and get all the selected value into an array and send it to post.

Html

<div *ngFor="let item of officeLIST">
  <div *ngIf ="item.officeID== userdata.officeID">
       <input #office type="checkbox" id="office" name="office" class="form-control" value="{{item.officeName}}" checked (click)="officeSelection($event,$event.target.value)" > {{(item.officeName== "" ? "--No data--" : item.officeName)}} 
 </div>
  <div *ngIf ="item.officeID!= userData.officeID">
     <input #office type="checkbox" id="office" name="office" class="form-control" value="{{item.officeName}}" (click)="officeSelection($event,$event.target.value)"> {{(item.officeName== "" ? "--No data--" : item.officeName)}}
 </div>
</div>
 <button type="button" class="btn btn-primary"(click)="updateOffice(userData.officeID)"> Save </button>

Click function (to add selected value and to remove unselected value)

 officeSelection(event: any, value) {        

        if (event.target.checked === true)
        {
               this.officeArray.push(value);
        } 
        else {
            this.officeArray.splice(this.officeArray.indexOf(value), 1);

        }
    }

Update Function

updateOfficeDetail(officeid) {

if(officeid= 1)
{    
         this.officeArray.push('stars dept');
}   
else if(officeid= 2)
{            

         this.officeArray.push('moon dept');
}
else
{          
     this.officeArray.push('Sun dept');

}

}

Problem is if I update the data without changing current value of checkbox,eg: sun dept,
this sun dept will be push into officeArray .
but if again I want to update the data by editing the checkbox(choose another value), so the previous selected value and current selected value will be push into this officeArray
if user did not edit the checkbox (just proceed with current selected value)>>>> the officeArray will look like this

["sun"]
and if the user tried to update the checkbox by clicking one more checkbox, the array will look like this
["sun","moon","sun"]

I just want ["sun","moon"] in the officeArray. should i remove? or clear something?

I tried to do some research and a lot questions similar to me. but somehow all the solutions did not work for me. any idea?

Thank you

I'd like to help, but it's confusing the description, at least for me, can you add a plunk with the code? will be easier I guess — Alejandro Lora
– Alejandro Lora, Commented Apr 5, 2017 at 13:24
i see. but actually it is a big code so i just extract small part of it to see wats the problem... — user3431310
– user3431310, Commented Apr 5, 2017 at 13:32

Enayat · Accepted Answer · 2017-04-05 14:50:11Z

1

I recommend using HashMap instead of array:

Map<String,String> officeMap = new HashMap<>();
officeMap.put(index, value);

answered Apr 5, 2017 at 14:50

Enayat

4,0621 gold badge35 silver badges52 bronze badges

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

Comments

El houcine bougarfaoui · Accepted Answer · 2017-04-06 08:58:37Z

1

in your if expression in updateOfficeDetail method:

if(officeid === 1)

instead of

if(officeid= 1)

I recommand in your case to use Set instead of Array:

class youComponent{
 //...
 officeSelection(event: any, value) {        

    if (event.target.checked === true)
    {
        if(this.officeArray.includes(value.trim())){
           this.officeArray.push(value);
        }
    } 
    else {
        this.officeArray.splice(this.officeArray.indexOf(value), 1);
    }
}

updateOfficeDetail(officeid) {

if(officeid === 1)
{    
         if(this.officeArray.includes('stars dept')){
             this.officeArray.push('stars dept');
         }

}   
else if(officeid === 2)
{            
       if(this.officeArray.includes('moon dept')){
         this.officeArray.push('moon dept');
       }
}
else
{    
     if(this.officeArray.includes('Sun dept')){
         this.officeArray.push('Sun dept');
     }

} 
}

}

edited Apr 6, 2017 at 8:58

answered Apr 5, 2017 at 13:29

El houcine bougarfaoui

37.6k10 gold badges40 silver badges38 bronze badges

3 Comments

user3431310 Over a year ago

i tried but for declaring it, i m getting generic type 'Set<T>' requires 1 type arguments. what argument should i put there?

user3431310 Over a year ago

it is working the same way how array worked. my stars dept keep added into list because it is the default value. so how do i make something like.. if this "stars dep" is already in officeArray then no need to add else we need to add. how the condition will look like?

El houcine bougarfaoui Over a year ago

@user3431310 see the update rewrite the code with Array

Collectives™ on Stack Overflow

How to remove duplicate value in an array Angular 2

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related