在重新加载页面且未进行筛选时显示完整的数组

Question

我是Angular的初学者，我正在制作一个简单的应用程序，其中有一个员工列表。我目前已经对想象中的员工的详细信息进行了硬编码。当有人搜索(想要过滤(时，我使用了set和get方法来过滤员工数组。我使用的逻辑存在的问题是，当在筛选框中没有输入任何内容时(当页面重新加载或用户后退所写内容时(，我想显示完整的用户列表，但当页面重新载入时，这不会发生。若用户输入内容，然后清除搜索框，则会显示完整列表，但在重新加载页面时不会显示。这是该组件的ts文件：

private _eidfilter:string='';
get eidfilter():string {
return this._eidfilter
}
set eidfilter(value : string){
this._eidfilter=value
this.filteredemp=this.performfilter(value.toString());
}
filteredemp:Emp[]=[];
performfilter(filterBy:string): Emp[] {
if(filterBy.trim.length==0){
return this.employees;
}
else{
return this.employees.filter((employee:Emp)=>employee.eid.toString()==filterBy)
}
}
employees:Emp[]=[
{eid:1,name:"Vikram",age:29,department:"WebDev",skills:5},
{eid:2,name:"Vetaal",age:30,department:"ML",skills:3.5},]

Answer 1

1. 导入ChangeDetectorRef

import { ChangeDetectorRef } from '@angular/core';

2. 将其注入构造函数

constructor(private chRef: ChangeDetectorRef) {  }

3. 填充员工数组后，将其用于您的ngOninit()方法

注意：在将数据放入正在使用的阵列后，请使用此更改检测技术。

ngOnInit(): void {
this.yourMethodToFillEmployeeDetails();
this.chRef.detectChanges();
}

Answer 2

目前filteredemp最初为空，仅在eidfilter更改时接收值。可以通过设置filteredemp的默认值或在加载时填充filteredemp来修复此问题。