Angular filter error?

Question

Angular

import {Component, Input, OnInit} from '@angular/core';
import {TicketsService} from '../../share/service/tickets.service';

@Component({
  selector: 'anv-list-won',
  templateUrl: './list-won.component.html',
  styleUrls: ['./list-won.component.css']
})

export class ListWonComponent implements OnInit {

  @Input()
  ticket:any = [];
  Search='';
  constructor(private ticketsService:TicketsService){}

  ngOnInit(){
    this.ticketsService.getWinTickets().subscribe(ticket =>{

      this.ticket=ticket.filter(c=>c.win==true);
      console.log(this.ticket)
    });
  }

}

<h1 class="center-align">Won</h1>

<div class="row ">
  <div class="input-field col s3">
    <input id="first_name" class="validate" [(ngModel)]="Search">
    <label class="active" for="first_name">Search Won</label>
  </div>
</div>

<div >
<ul class="collection with-header" >
  <li class="collection-item" *ngFor="let tiket of ticket | search:Search" >
    <div>{{tiket.payeer}}</div>
  </li>
</ul>
</div>

import {Pipe, PipeTransform} from '@angular/core';

@Pipe({
  name:'search'
})
export class SearchPipe implements PipeTransform{
  transform(ticket,value){
    return ticket.filter(
      c=>c.ticket.includes(value)
    );
}

}

ERROR TypeError: Cannot read property 'includes' of undefined
at search.pipe.ts:9
at Array.filter ()
at SearchPipe.push../src/app/share/service/search.pipe.ts.SearchPipe.transform ( search.pipe.ts:8)

Answer 1

What does an element of the ticket array look like? I mean, does it have a ticket property that you're trying to filter by? I would suggest that you just got a little confused in the names of the properties and instead of the non-existent ticket (it's strange - the array and the properties of its elements have the same names) some other property should be used ... for example, payeer, which you display in the template. Or something else.