Блог

На самом деле я получаю список сотрудников из API и должен опубликовать данные в виде массива объектов одним щелчком мыши. Данные post будут выглядеть следующим образом.

     {
"date" : "15/08/2020",  //Current Date
"empAttendance" : [
        {
                "EmpId":"3",
                "AttendanceType": "P"
        },
        {
                "EmpId":"5",
                "AttendanceType": "P"
        }, // More Like this.
        ]
}
  

Интерфейс выглядит следующим образом —
введите описание изображения здесь

Итак, как пройти через это? Не могли бы вы, пожалуйста, мне помочь. Я ищу по всему Интернету. Я новичок в angular. Если есть какая-либо другая идея, которая также полезна. Спасибо.

Live Exmpale

Вы можете сделать это следующим образом: Код компонента:

 import { Component, VERSION } from "@angular/core";
import { HttpClient } from "@angular/common/http";

export interface Attendence {
  date: String; //Current Date
  empAttendance: Array<Employee>;
}

export interface Employee {
  EmpId: String;
  AttendanceType: String;
}


@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  name = "Angular "   VERSION.major;

  constructor(private httpClient: HttpClient) {}
  postArray: Attendence[];
  source = {
    date: "15/08/2020", //Current Date
    empAttendance: [
      {
        EmpId: "3",
        AttendanceType: "P"
      },
      {
        EmpId: "5",
        AttendanceType: "P"
      } // More Like this.
    ]
  };

  postData(source: any) {
     this.postArray = [
       {
         date:this.source.date,
        empAttendance:this.source.empAttendance
       }
     ]
     console.log(this.postArray);
    // below code should be in service.
    this.httpClient.post("url", this.postArray).subscribe(
      res => {
        console.log("Posted");
      },
      err => {
       // console.log(err);
      }
    );
  }
}
  

Шаблон:

 <button (click)="postData(source)" >Post Data</button>