Question

我创建了一个表单以向后端提交一些数据，但是当我单击“提交”按钮时，什么都没有发生，这是我的代码：

app.component.html :
<form[formGroup]="plcService.form" class="normal-form"
(Submit) = "onSubmit()" >
<mat-grid - list cols = "2" rowHeight = "600px" >
<mat-grid - tile >
<div class="controles-container" >
  <input type="hidden" formControlName = "$key" />
    <mat-form - field >
    <input formControlName="name" matInput placeholder = "Name" />
      </mat-form-field>
      < mat - form - field >
      <input formControlName="age" matInput placeholder = "Age" />
        </mat-form-field>
        < mat - form - field >
        <input formControlName="email" matInput placeholder = "Email" />
          </mat-form-field>
          < div class="button-row" >
            <button mat - raised - button color = "primary" type = 
  "submit"
              (click) = "onSubmit()" >
              Save
              < /button>
              < button mat - raised - button color = "warn"(click) = 
   "onClear()" >
                Clear form
                  < /button>
                  < /div>
                  < /div>
                  < /mat-grid-tile>
                  < /mat-grid-list>
                  < /form>


  app.compenent.ts :
  onSubmit() {
  this.systemService.addSystem(this.system);
  }

  systemService.ts :

  addSystem(system: System): Observable < System > {
  return this.http.post<System>(this.endpoint, system, httpOptions).pipe(
  tap((system: System) =>
  console.log(`Created or updated system w/ id=${system.name}`)
  ),
  catchError(this.handleError<System>('addSystem'))
  );
  }

system.model :

export class System {
public name: string;
public age: string;
public email: string;
}

提交表单时，在控制台中，我会收到[Object Object]而不是System类型的JSON对象。有任何想法吗？

如何正确提交角形？

0 个答案: