Hai di sini saya memiliki kelas sebagai

export class Employeemodel {
    constructor() {
        this.name = "";
        this.gender = 0;
    }
    name: string;
    gender: number;
}

Ketika saya mencoba untuk Mengikat data ke Kelas Ini sebagai

// EmployeeService.ts

GetData<T>(pagenum:number) {
    return this
        .http
        .get<Employeemodel[]>(this.apiUrl+'GetPagination/'+pagenum)
        .pipe(tap(data => {
            
        }));
}
// EmployeeComponent.ts
 
GetPagination(PageNo: number) {
    this._oservices
        .GetData(PageNo)
        .subscribe((result: Employeemodel[]) => {
            this.dataSource = new MatTableDataSource(result.otestgrid);   
        });
}

result.otestgrid Mendapatkan Kesalahan karena Properti 'otestgrid' tidak ada pada jenis 'Employeemodel[]'.

Panggilan Layanan Saya Memberi Saya output sebagai

{
    "otestgrid": [
        {
            "name": "Dastageer",
            "gender": 1,
            "distName": "Hyderabad",
            "otestBindata": null
        },
}
1
MD Gosoddin 13 Mei 2021, 10:31

2 jawaban

Jawaban Terbaik

Employeemodel Anda harus diwujudkan seperti ini, Juga saya sarankan dalam kasus cammel

export class EmployeeModel {
  "name": string;
  "gender": number;
  "distName"?: string;    // if it should be optional you can add `?`
  "otestBindata"?: unknown // unknown since I don't know what is the type, you can change
}

Dan sebenarnya, tipe respons Anda adalah { otestgrid: EmployeeModel[] } jika Anda tidak mengubah data setelah mendapatkan respons.

Jadi fungsi Anda dalam layanan akan terlihat seperti ini

GetData(pagenum:number){
    return this.http
       .get<{ otestgrid: EmployeeModel[] }>(
          this.apiUrl+'GetPagination/'+pagenum
       ).pipe(tap(data=>{}));
}
1
Ashot Aleqsanyan 13 Mei 2021, 07:43

antarmuka itu hanya menulis

public interface DataResponse{
  otestgrid: EmployedData[]
}
public interface EmployedData{
{
 name:string;
 gender:number;
 distName:string;
 otestBindata": any;
}

Lihat itu, jika kita tidak berpikir untuk membuat metode, lebih baik menggunakan antarmuka kelas itu.

Ingat bahwa TypeScript "transpile" Angular (mengubah TypeScript ke javascript) jadi satu-satunya yang kami buat menggunakan "variabel yang diketik" adalah membantu kami untuk menulis kode. Beberapa seperti

this.http.get<{ otestgrid: EmployeeModel[] }>(...)

tidak yakin bahwa kami menerima respons dari jenis yang ditunjukkan, dan tidak mengubah respons tersebut. Responsnya akan menjadi respons terhadap panggilan - bayangkan Anda melewatkan dan menunjukkan panggilan lain, Angular tidak dapat memperhitungkan ini

0
Eliseo 13 Mei 2021, 08:00