How to filter an array and return the entire object - Angular

问题

export class ResultComponent {
    students: AdmissionFormData[]

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

    onSubmit(value) {

    }
}

In the students array, I have the data. And onSubmit is the function and value is the parameter "roll"

And the HTML File:

<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>

I want to search for the roll in this array and if I find a match then I would like to return the whole array and use it somewhere.

Now how can I do that?

I think I made a mistake before so I edit the question. Please forgive me I'm new here.

回答1:

You can use array.filter with the property you want to filter, since you have not mentioned the property, assuming it as fullname

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

or if you want single Object, use array.find

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

回答2:

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)
    }
}

I see on your first two objects that they have the same reg number. If you need to return just one Object you have to use find, because filter will return all the matches. I also specified the return type because it's good practice.

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

UPDATE

My code works for what you asked for, filtering. I have created a stackblitz with your forms using fake data and I get to filter the array. One of you issues why my code wasn't working is because you are passing a Object not a String, but I didn't know that because you didn't have an HTML. Take a look to my https://stackblitz.com/edit/angular-nt2ksu and see how I handle that

回答3:

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

Here, s is a student object, and you are filtering objects that have their reg values match the value of onSubmit(value).

This will return an array of objects with specified reg values.

来源：https://stackoverflow.com/questions/52299834/how-to-filter-an-array-and-return-the-entire-object-angular

标签

angular

angular-arrays