anguar passing value from input to model-CodePudding

I am making a put request. How can i pass value from input form to my model to pass value that i am filling up - before send form. everything what i have tried it had been thrown errors.

my model .ts file

 export class Uniticket {
          pk?: string;
          sk?: string;
          PK?: string;
          SK?: string;
          ticketid?: number;
          createdate?: Date;
          status?: string;
          interactionid?: string;
          subject?: string;
          body?: string;
          user?: string;
          entitytype?: string;
          lastupdate?: Date;
          lastupdateuser?: string;
        }

my html :

 <form #userPost="ngForm" (ngSubmit)="onSubmit()">
      <mat-form-field appearance="legacy">
        <input
          matInput
          type="text"
          name="ticketid"
          id="ticketid"
          [(ngModel)]="ticketid"
        />
        <mat-icon *matSuffix>how_to_reg</mat-icon>
      </mat-form-field>

      <mat-form-field appearance="legacy">
        <input
          matInput
          type="text"
          name="createdate"
          id="createdate"
          [(ngModel)]="createdate"
        />
<mat-icon matSuffix>calendar_today</mat-icon>
      </mat-form-field>

my type script component :

   export class TicketsFormComponent implements OnInit {
  ticketid: number = 0;
  createdate: string = '';
  interactionid: string = '';
  subject: string = '';
  body: string = '';
  user: string = '';

  constructor(private service: TicketsService) {}
  ngOnInit() {}
  public addTicket() {
    let resp = this.service.addTicket();
    resp.subscribe((report) => {
      console.log('report', report);
    });
  }

  onSubmit() {
    console.log(this);
    this.addTicket();
  }
}

thank you in advance

CodePudding user response：

You just need a button with type='submit' within your form

<form #userPost="ngForm" (ngSubmit)="onSubmit()">
  ...
  <button type="submit">SUBMIT</button>
</form>

That will trigger the function you've specified with (ngSubmit)

The data within the form is always synchronized with the data in your component as you've used the [(ngModel)] two-way binding. So to get the ticketid for example you can just use this.ticketid.

  onSubmit() {
    //Log the ticket id from the form
    console.log(this.ticketid);
  }

CodePudding user response：

The ng-submit directive specifies a function to run when the form is submitted. If the form does not have an action ng-submit will prevent the form from being submitted.