Angular 6 HTTP GET отправка идентификатора Param

Question

На странице HTML пользователь вводит идентификационный номер.Я пытаюсь выяснить, как получить тот профиль пользователя (из моей базы данных SQL), который соответствует введенному идентификатору, с помощью вызова HTTP GET для моего API.Я исследовал, как этот процесс развивался с новыми версиями Angular, поэтому я думаю, что мне нужно отправить с параметрами с Angular 6 (?).Может ли Angular вернуть этот объект одному и тому же компоненту HTML?

Мне удалось ПОЛУЧИТЬ весь объект ВСЕХ пользователей, но не один пользователь соответствовал введенному идентификатору (пробовал использовать getters / setters w / ID, но сделалне работа).Поскольку у меня уже есть весь объект, возможно, существует другой способ сопоставления идентификатора, введенного с идентификатором во всех объектах пользователей?

HTML ...

   <div class="col-sm-6 form-group">
    <label for="name">Student ID 1</label>
    <input type="text" id="ClassTimesStudentID" name="ClassTimesStudentID" required [(ngModel)]="ClassTimesStudentID"
      class="form-control">
  </div>

  <button class="button" type="button" (click)="getCheckInByID()">Enter</button>

 <!-- This should show the record Id of the one user -->
    <div  *ngFor="let day of userFromID" class="col-sm-6 form-group">
      <label for="id-input">Record Id </label>
      <input type="text" name="studentRowRecordID" [(ngModel)]="day.studentRowRecordID" 
        [(ngModel)]="ClassTimesRowId" class="form-control"> </div>

Component.ts...

 import { Component, OnInit, ViewChild } from '@angular/core';
 import { NgForm } from '@angular/forms';
 import { DataStorageService } from 'src/app/shared/data-storage.service';

 @Component({
   selector: 'app-logout',
   templateUrl: './logout.component.html',
   styleUrls: ['./logout.component.css']
 })

 export class LogoutComponent implements OnInit {
   public allCheckIns: Array<any>;
   public userFromID: Array<any>;

  constructor(private dataStorageService: DataStorageService) {
     dataStorageService.getCheckInList().subscribe((importCheckIns: any) => 
     this.allCheckIns = importCheckIns);
     console.log('checkins ' + this.allCheckIns);
    }

    ngOnInit() {
   }

 getCheckInByID() {
     this.dataStorageService.getCheckInByID().subscribe((importOne: any) => 
 this.userFromID = [importOne]);
     console.log('one user ' + this.userFromID);
    }

 }

data-storage.service.ts ...

 import { Injectable } from '@angular/core';
 import { Http, Response } from '@angular/http';
 import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
 import 'rxjs/Rx';

  @Injectable()
  export class DataStorageService {
   private headers: HttpHeaders;
   private accessPointUrl: string = 'http://localhost:59673/api/ClassTimes';

    ClassTimesStudentID: any;


   constructor(private http: HttpClient, private httpClient: HttpClient,) {
   this.headers = new HttpHeaders({'Content-Type': 'application/json; 
   charset=utf-8'});
    }

  // This works, returns all users
     public getCheckInList() {
     return this.http.get(this.accessPointUrl, {headers: this.headers});
   }

   // This is where I need the most help
    public getCheckInByID() {
      let data = this.ClassTimesStudentID;
     return this.http.get(this.accessPointUrl, {params: data}, {headers: 
     this.headers});
   }

Answer 1

Мне удалось заставить это работать, настроив его как вызов пут, который не использует params.Вот новый вызов службы ...

  public getCheckInByID(payload) {
return this.http.get(this.accessPointUrl + '/' + payload.ClassTimesStudentId, 
{headers: this.headers});
  }

Я также должен был удалить скобки из "importOne", не зная почему.Правильная версия ....

   getCheckInByID() {
  this.dataStorageService.getCheckInByID().subscribe((importOne: any) => 
  this.userFromID = importOne);}