首页 > 解决方案 > Angular TypeError:无法读取属性“toLowerCase”

问题描述

我正在尝试使用离子搜索栏过滤一组项目,但我的 ts 函数给了我一个错误:

错误类型错误:无法读取属性“toLowerCase”

html代码

<ion-searchbar (ionInput)="function($event)"  showCancelButton="never"></ion-searchbar>
 <div *ngFor="let item of items | async">
  {{item.data.titre}} 
 </div>

打字稿代码

 itemsCollection: AngularFirestoreCollection<Item>;
 items:Observable<any[]>;

ngOnInit(){
      this.itemsCollection=this.fs.collection('Items', ref=>ref.orderBy('Timestamp', 'desc'));
      this.items=this.itemsCollection.snapshotChanges().pipe(
        map(actions => {
          return actions.map(a=>{
            const data=a.payload.doc.data() as Item;
            const id = a.payload.doc.id;
            return{ id, data};
          })
        }));
    }  

function(ev:any){
    this.ngOnInit();
    let val=ev.target.value
    if(val && val.trim()!=''){
    this.items = this.items.filter((item: any) => {
      return (item.titre.toLowerCase().indexOf(val.toLowerCase()) > -1);
    })
    }
  }

我无法解决,谢谢你帮助我

标签: angulartypescriptionic-frameworkgoogle-cloud-firestore

解决方案


<div *ngFor="let item of items | async">
  {{item.data.titre}} 
 </div>

您错过了dataitems 数组的每个对象的属性。

肯定是: -

this.items = this.items.filter((item: any) => {
      return (item.data.titre.toLowerCase().indexOf(val.toLowerCase()) > -1);
    })

推荐阅读