如何过滤数组并返回整个对象-Angular

时间:2018-09-12 16:34:18

标签: angular angular-arrays

export class ResultComponent {
    students: AdmissionFormData[]

    constructor(private adStudent: AdmissionFormService) {
        adStudent.adFormGet().subscribe(
            x => this.students = x
        )
    }

    onSubmit(value) {

    }
}

在学生数组中,我有数据。而onSubmit是函数,值是参数“ roll”

和HTML文件:

<div class="form">
<div class="col-md-5 offset-md-3">
  <div class="card">
      <div class="card-header text-center">
          <h3 id="form_name" >Search Result</h3>
      </div>

      <div class="card-block">
          <form (ngSubmit)="onSubmit(f.value)" #f="ngForm" >
              <div class="form-group">
                <label for="">Roll</label>
                <input
                type="number" 
                ngModel
                name="reg" 
                #reg="ngModel" 
                [min]="99999"
                placeholder="Ex: 224697"
                class="form-control">
                <p class="text-danger" *ngIf="!reg.valid && reg.touched">Roll Should have at least 6 letter</p>
              </div>
              <input 
              type="submit"
              value="Search" 
              class="btn btn-block btn-outline-success">
          </form>
      </div>
  </div>

The array

我想搜索该数组中的掷骰,如果找到匹配项,我想返回整个数组并在某个地方使用它。

现在我该怎么办?

我认为我之前犯了一个错误,所以我编辑了问题。 请原谅我我是新来的。

3 个答案:

答案 0 :(得分:1)

您可以将array.filter与要过滤的属性一起使用,因为您没有提到该属性(假设其为 fullname

this.students = this.students.filter(t=>t.fullname ===roll)[0];

或者如果您想要单个对象,请使用array.find

let studentObj =  this.students.find(t=>t.fullname ===roll);

答案 1 :(得分:0)

return this.students.filter(s => s.reg === value)

在这里,s是一个学生对象,您正在过滤其reg值与value的{​​{1}}匹配的对象。

这将返回具有指定reg值的对象数组。

答案 2 :(得分:0)

export class ResultComponent {
    students: AdmissionFormData[]

    constructor(private adStudent: AdmissionFormService) {
        adStudent.adFormGet().subscribe(
            x => this.students = x
        )
    }

    onSubmit(value):AdmissionFormData[] {
     return this.students.filter(student => student.reg === value)
    }
}

我在您的前两个对象上看到它们具有相同的注册号。如果只需要返回一个对象,则必须使用find,因为filter将返回所有匹配项。我还指定了返回类型,因为这是一种很好的做法。

onSubmit(value):AdmissionFormData[] {
   return this.students.find(student => student.reg === value)
}

更新

我的代码可以根据您的要求进行过滤。我已经使用假数据为您的表单创建了一个堆栈闪电,然后过滤了该数组。你们当中的一个问题是为什么我的代码无法正常工作是因为您传递的是对象而不是字符串,但是我不知道那是因为您没有HTML。看看我的https://stackblitz.com/edit/angular-nt2ksu,看看我如何处理