Как я могу отправить значения объекта, чтобы отправить функцию запроса в angular 5+.?

Question

компонент. html

<form [formGroup]="classForm" (ngSubmit)="onSubmit()">
    <label for="">Select Class:</label>
    <div class="form-group">
        <select formControlName="infoo" class="form-control" *ngFor="let info of classinfo">
            <option [ngValue]="info">{{info.degree}}:{{info.semester}}({{info.section}})"{{info.session}}"</option>
        </select>
    </div>
    <button class="btn btn-outline-info ">Proceed </button>
</form>

component.ts

classForm = this.fb.group(
    {
        infoo: ['']

    }
);

onSubmit()
{
    this._userService.sendClassToAttend(this.classForm.value);
    this._router.navigateByUrl('Teacher-homepage/classattendance');
    console.log(this.classForm.value);
}

console.log результат

когда я отправляю запрос, я получил пустые данные на сервере. как получить доступ к значению объекта, например, infoo.degree, и правильно отправить его на сервер.

Answer 1

Пожалуйста, попробуйте это, если вы хотите отправить одно значение на сервер, если вы хотите опубликовать весь объект, код, который вы использовали, должен выполнить эту работу.

 onSubmit()
  {
    this._userService.sendClassToAttend(this.classForm.value.infoo.degree);
     this._router.navigateByUrl('Teacher-homepage/classattendance');
    console.log(this.classForm.value);
  }  

Метод в классе обслуживания выглядит следующим образом:

sendClassToAttend(student: any): Observable<any> {
    return this.http.post<any>(this.url, student, {
      headers: new HttpHeaders({
        'Content-Type': 'application/json'
      })
    }).pipe(catchError(this.handleerror));
  }  

handleerror - это пользовательский метод, который я создал для своего приложения, эту часть можно игнорировать.