-2

I want to create a pipe to check specific object, not all. This Pipe will have to hide duplicate.

Pipe

import { Pipe } from '@angular/core'
@Pipe({
    name: 'removeduplicates'
})
export class RemovePipe {

}

Template

<tbody *ngFor="let dt of ash let i = index | removeduplicates: " >
    <tr>
        <td class="tg-yw4l nobord"  style="border-left:  inset;border-right:  none;">{{dt.values}}</td>          
        </tr>
    <tr>            
        <td>{{dt.value2}}</td>
    </tr>
</tbody>
sainu
  • 2,686
  • 3
  • 22
  • 41
Sevensnake
  • 119
  • 1
  • 2
  • 14

1 Answers1

2

on your component please add a function to remove duplicates 

result:any=[];
removeDupliacate(){
   this.ash.forEach(function(item) {
        if(this.result.indexOf(item) < 0) {
            this.result.push(item);
        }
   });
}

and then in your template 

<tbody *ngFor="let dt of result;let i = index" >
    <tr>
        <td class="tg-yw4l nobord"  style="border-left:  inset;border-right:  none;">{{dt.values}}</td>          
        </tr>
    <tr>            
        <td>{{dt.value2}}</td>
    </tr>
</tbody>

or you can implement pipe with the help of lodash by installing 

$ npm install --save lodash

this link may help you to install and use lodash

in your component:

import { Pipe, PipeTransform } from '@angular/core';
import * as _ from 'lodash'; 
@Pipe({
    name: 'removeduplicates'
})
export class RemovePipe implements PipeTransform{
   transform(value: any): any{
        if(value!== undefined && value!== null){
            return _.uniqBy(value, 'name');
        }
        return value;
    }
}

and in your template

<tbody *ngFor="let dt of ash let i = index | removeduplicates" >
    <tr>
        <td class="tg-yw4l nobord"  style="border-left:  inset;border-right:  none;">{{dt.values}}</td>          
        </tr>
    <tr>            
        <td>{{dt.value2}}</td>
    </tr>
</tbody>
sainu
  • 2,686
  • 3
  • 22
  • 41
  • old post but... in your first method, how/where do you actually call your method 'removeDuplicate'? To me, it looks like result is initalized as an empty array and that's what is passed to the template... how do I get values in there? – PLB Apr 10 '19 at 19:26
  • @PLB we are iterating through `this.ash` array and pushing elements to `results` array, thats why it is declared as empty array. And we can call our `removeDuplicate` method after getting values to `this.ash` array. – sainu Apr 11 '19 at 05:24
  • Hey Sainu thank you for your answer! So you mean that you will call "removeDuplicate" on Component-level? Like in the Constructor? Anyway, I found a way to remove my duplicates using a Pipe. I'm just not sure whether that is the best practice or not... – PLB Apr 11 '19 at 21:03