Angular2, RC5: Not adding duplicate values in dropdown

Question

I am getting tests values from remote server, GroupID values can be duplicated, but I wish my dropdown will show values without duplication, I tried the following code, which is not working

<th>
<select class="form-control" (change)="reloadPosts({ GroupID: u.value })" #u>
<option value="">Select group id...</option>
<template *ngFor="let test of tests"> <option *ngIf="!test" value="{{ test.GroupID }}">
{{ test.GroupID }}
</option></template>
</select>
</th>

how can I do it with angular rc5 and above

thanks

Did it work with RC.4? What values are you using (string, object, ...)? — Günter Zöchbauer
– Günter Zöchbauer, Commented Sep 5, 2016 at 18:57
Try with objects instead or trackBy stackoverflow.com/questions/33363987/… — Günter Zöchbauer
– Günter Zöchbauer, Commented Sep 5, 2016 at 20:01

Rob · Accepted Answer · 2016-09-05 19:53:57Z

0

You should be able to do this with a simple pipe...

@Pipe({ name: 'unique', pure: false })

export class UniquePipe implements PipeTransform {
    transform(value: any, args: any[] = null): any {
        return _.uniq(value);
    }
}

Then in your html use *ngFor="let test of tests | unique"

The pipe example uses underscore.js but feel free to write the filter any way you'd like.

More information on pipes.

answered Sep 5, 2016 at 19:53

Rob

12.9k4 gold badges44 silver badges57 bronze badges

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

Comments

Community · Accepted Answer · 2017-05-23 11:46:43Z

0

I was unable to solve this using pipe, so I modified my component code, see: Angular2, create new array/map

edited May 23, 2017 at 11:46

CommunityBot

11 silver badge

answered Sep 6, 2016 at 19:15

Shay Binyat

1151 gold badge1 silver badge9 bronze badges

Collectives™ on Stack Overflow

Angular2, RC5: Not adding duplicate values in dropdown

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related