Angular 通过ajax导出角度数据表

如何使用从后端获得的json数据填充Datatable？在console.log中，数据正确显示

我得到了数据，但我不能在数据表中发送它们。我用了很多方法，但都失败了 他们帮不了什么忙

----------在html文件中-------

身份证件
用户名
名字
姓
电子邮件
电话
启用
isDoctor
账户
删除ACC
{{patient.patientID}
{{patient.username}
{{patient.firstName}
{{patient.lastName}
{{patient.email}
{{病人电话}
{{patient.enabled}
使可能
使残废
使可能
使残废
删除
没有数据！

---

-----在下面的组件文件中------

dtOptions:any={}；
常数=this；
让url=”http://localhost:8015/api/patient/all";
此.dtOptions={
ajax:（）=>{
那是http
.得到(
网址，
{withCredentials:true}
).订阅（resp=>{
this.test=JSON.stringify（resp）；
that.patientUser=JSON.parse（JSON.stringify（resp））；
});
},
//在dom参数中声明扩展的使用
栏目：[{
标题：“ID”，
数据：“patientID”
}, {
标题：“名字”，
数据：“名字”
}, {
标题：“姓氏”，
数据：“lastName”
}],
dom:'Bfrtip'，
//配置按钮
按钮：[
“columnsToggle”，
“科尔维斯”，
“复制”，
“打印”，
“卓越”
]
};

假设我们尝试了上述注释中提到的所有内容（更像是调试的方式）。组件中的最终代码应该接近1。另外，有人可以直接调用ajax并将其放入变量中

export class TestComponent implements OnInit {

    dtOptions: DataTables.Settings = {};
    patientUser: UserAccount[];

    constructor(private http: HttpClient) { }

    ngOnInit(): void {
        const that = this;

        this.dtOptions = {
            pagingType: 'full_numbers',
            pageLength: 2,
            serverSide: true,
            processing: true,
            ajax: (dataTablesParameters: any, callback) => {
                that.http
                    .get<UserAccount>(
                        'http://localhost:8015/api/patient/all',
                        dataTablesParameters, {}
                    ).subscribe(resp => {
                        that.patientUser = resp.data; //would depend on resp object
                    });
            },
            columns: [{
                title: 'ID',
                data: 'patientID'
            }, {
                title: 'First name',
                data: 'firstName'
            }, {
                title: 'Last name',
                data: 'lastName'
            }],
            dom: 'Bfrtip',
            // Configure the buttons
            buttons: [
                'copy', 'csv', 'excel', 'print'
            ]
        };
    }
}

导出类TestComponent实现OnInit{
dtOptions:DataTables.Settings={}；
patientUser:UserAccount[]；
构造函数（私有http:HttpClient）{}
ngOnInit（）：void{
常数=this；
此.dtOptions={
pagingType:“完整编号”，
页长：2，
服务器端：是的，
处理：对，
ajax：（dataTablesParameters:any，callback）=>{
那是http
.得到(
'http://localhost:8015/api/patient/all',
dataTablesParameters，{}
).订阅（resp=>{
that.patientUser=resp.data；//将取决于resp对象
});
},
栏目：[{
标题：“ID”，
数据：“patientID”
}, {
标题：“名字”，
数据：“名字”
}, {
标题：“姓氏”，
数据：“lastName”
}],
dom:'Bfrtip'，
//配置按钮
按钮：[
“复制”、“csv”、“excel”、“打印”
]
};
}
}

您得到的错误是什么？@Manit我实际上没有得到任何错误数据表是空的，json放在某处。上面写着…加载。。。但是控制台debug nothins显示错误扫描您只需在模板中保留三个属性，即ID、first name和last name，然后尝试一下？@Manit它们现在确实出现了您是正确的！有了这三个属性，它仍然表示加载思想。。。。但当我按copy/csv/excel export时，什么也没有显示。我认为带有数据列的ajax调用在某种程度上没有连接，我认为这是一个错误

    dtOptions: any = {};


    const that = this;
    let url = "http://localhost:8015/api/patient/all";
    this.dtOptions = {
        ajax: () => {
          that.http
            .get<UserAccountComponent>(
                url,
               {withCredentials: true}
            ).subscribe(resp => {
                this.test=JSON.stringify(resp);
              that.patientUser = JSON.parse(JSON.stringify(resp));
            });
        },
        // Declare the use of the extension in the dom parameter
        columns: [{
            title: 'ID',
            data: 'patientID'
          }, {
            title: 'First name',
            data: 'firstName'
          }, {
            title: 'Last name',
            data: 'lastName'
          }],
        dom: 'Bfrtip',
        // Configure the buttons
        buttons: [
          'columnsToggle',
          'colvis',
          'copy',
          'print',
          'excel'
        ]
      };

export class TestComponent implements OnInit {

    dtOptions: DataTables.Settings = {};
    patientUser: UserAccount[];

    constructor(private http: HttpClient) { }

    ngOnInit(): void {
        const that = this;

        this.dtOptions = {
            pagingType: 'full_numbers',
            pageLength: 2,
            serverSide: true,
            processing: true,
            ajax: (dataTablesParameters: any, callback) => {
                that.http
                    .get<UserAccount>(
                        'http://localhost:8015/api/patient/all',
                        dataTablesParameters, {}
                    ).subscribe(resp => {
                        that.patientUser = resp.data; //would depend on resp object
                    });
            },
            columns: [{
                title: 'ID',
                data: 'patientID'
            }, {
                title: 'First name',
                data: 'firstName'
            }, {
                title: 'Last name',
                data: 'lastName'
            }],
            dom: 'Bfrtip',
            // Configure the buttons
            buttons: [
                'copy', 'csv', 'excel', 'print'
            ]
        };
    }
}