输入搜索过滤api Angular

// app.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  items = [
    { name: 'Apple' },
    { name: 'Banana' },
    { name: 'Cherry' },
    { name: 'Date' },
    { name: 'Elderberry' }
  ];
  searchQuery = '';

  get filteredItems() {
    return this.items.filter(item => 
      item.name.toLowerCase().includes(this.searchQuery.toLowerCase())
    );
  }
}

<!-- app.component.html -->
<input type="text" [(ngModel)]="searchQuery" placeholder="Search...">
<ul>
  <li *ngFor="let item of filteredItems">{{ item.name }}</li>
</ul>