angular制作一个根据患者Id查询患者的方法，患者数据写不到页面上。

Question

angular制作一个根据患者Id查询患者的方法，患者数据写不到页面上。
患者数据是用数组储存的。

```typescript
const Patient: any[]= [
    { Id: "0", FirstName: "Stark", LastName: "Bill", DateOfBirth: "2000/10/11", Gender: "Male", PrimaryInsurance: "Medicare", Address: "ddadsdasd", ContactNumber: "1338872818738", NextOfKin: "weqe" },
    { Id: "1", FirstName: "Shown", LastName: "Jenny", DateOfBirth: "2000/10/11", Gender: "Male", PrimaryInsurance: "Medicare", Address: "ddadsdasd", ContactNumber: "1338872818738", NextOfKin: "weqe" },
    { Id: "2", FirstName: "Geogrge", LastName: "Hash", DateOfBirth: "2000/10/11", Gender: "Male", PrimaryInsurance: "Medicare", Address: "ddadsdasd", ContactNumber: "1338872818738", NextOfKin: "weqe" },
    { Id: "3", FirstName: "Intwre", LastName: "zaiwoo", DateOfBirth: "2000/10/11", Gender: "Male", PrimaryInsurance: "Medicare", Address: "ddadsdasd", ContactNumber: "1338872818738", NextOfKin: "weqe" },
    { Id: "4", FirstName: "Niko", LastName: "baby", DateOfBirth: "2000/10/11", Gender: "Male", PrimaryInsurance: "Medicare", Address: "ddadsdasd", ContactNumber: "1338872818738", NextOfKin: "weqe" }
    ];
    const result: any[]= [];

我做的搜索方法：

```typescript
search(Id: string){
 const index = Patient.indexOf(Id);   
   var item = Patient [index];  
   
const result = Patient.filter(function (item) {
if (item.Id== Id) {
    return true;
    } else {
    return false;
}
})
console.log(result);


           
}

html：

   
Search a patient by ID
<label for="Patient_IDText3">Enter patient_ID: </label>
<input type="text" id="patient_IDText3" [(ngModel)]="patient_IDText3" [ngModelOptions]="{standalone: true}"/> 
<input type="button" value="Search" (click)="search(patient_IDText3)">

在页面输入ID在控制台是可以看见搜到数据的：

可当我尝试新做一个表格来显示这个搜到的数据时它报错。
我尝试的代码：

<table class="list-table">
    <thead>
      <th>Patient ID*</th>
      <th>First name*</th>
      <th>Last name*</th>
      <th>Date of birth *</th>
      <th>Gender*</th>
      <th>Primary insurance*</th>
      <th>Address *</th>
      <th>Contact number *</th>
      <th>Next of kin</th>
    </thead>
    <tbody>
      <tr *ngFor="let result of result">
        <td>{{ result.Id }}</td>
        <td>{{ result.FirstName }}</td>
        <td>{{ result.LastName }}</td>
        <td>{{ result.DateOfBirth }}</td>
        <td>{{ result.Gender }}</td>
        <td>{{ result.PrimaryInsurance }}</td>
        <td>{{ result.Address }}</td>
        <td>{{ result.ContactNumber }}</td>
        <td>{{ result.NextOfKin }}</td>
         </tr>
    </tbody>
  </table>

错误：

于是我尝试在AppComponent里声明了一下result：

result=result;

它报这个错，于是我加了this.

它报这个错。
于是我尝试新建一个空数组result，html表格里绑定result数组里的数据，当使用search方法时将filter出来的数据加到result数组里。

search(Id: string){
 const index = Patient.indexOf(Id);   
   var item = Patient [index];  
   
const re = Patient.filter(function (item) {
if (item.Id== Id) {
    return true;
    } else {
    return false;
}
})
console.log(re);
 result.push({ Id: this.re.Id,
        FirstName:this.re. FirstName,
        LastName: this.re.LastName,
        DateOfBirth: this.re.DateOfBirth,
        Gender: this.re.Gender,
        PrimaryInsurance:this.re.PrimaryInsurance,
        Address:this.re.Address,
        NextOfKin:this.re.NextOfKin
});

           
}

但它又报这个错

问题好像又回到原点了。
请问该怎么解决这个问题让网页可以显示搜索出来的数据？

Answer 1

改下面的试试

    let result: any[] = [];//不能用const，要不search里面赋值错误，改let
    search(Id: string){
        //const index = Patient.indexOf(Id);
        //var item = Patient[index];
        //这里不用加const，加上就是内部变量了，直接修改上面的result全局变量
       /*const*/ result = Patient.filter(function (item) {
            if (item.Id == Id) {
                return true;
            } else {
                return false;
            }
        })
        console.log(result);

    }

最后一个尝试是因为re是内部变量，不需要加this

    search(Id: string){
        //const index = Patient.indexOf(Id);//这里有问题，上个问题已经说过，Patient是对象数组，Id是字符串，直接indexOf找不到下标的，index为-1
        //var item = Patient[index];//index为-1，这里item就变为undefined了

        //而且找数组中对象直接用find就行，不用获取下标，改下面这样
        var item = Patient.find(i => i.Id == Id);
        result.length = 0;//删除结果数组中所有项
        if (item != undefined) {//找到，压入结果
            result.push(item);
        }

        /*

        const re = Patient.filter(function (item) {
            if (item.Id == Id) {
                return true;
            } else {
                return false;
            }
        })
        console.log(re);
        result.push({
            Id: this.re.Id,
            FirstName: this.re.FirstName,
            LastName: this.re.LastName,
            DateOfBirth: this.re.DateOfBirth,
            Gender: this.re.Gender,
            PrimaryInsurance: this.re.PrimaryInsurance,
            Address: this.re.Address,
            NextOfKin: this.re.NextOfKin
        });*/
    }