Question

Angular 4.2.4 Angular-Datatables 4.2.0

HTML

<table datatable [dtOptions]="dtOptions"></table>

组件

ngOnInit() {

    this.dtOptions = {
        ajax: {
            url: "http://localhost:8880/nmets/api/manifest/search",
            type: 'POST',
            contentType: 'application/json; charset=UTF-8',
            error: function(xhr, error, code) { console.log(error); },
            success: function(result) {console.log(JSON.stringify(result))},
            data: function(data) {
                data['dto'] = this.manifest;
                return JSON.stringify(data);
            }.bind(this)
        },
        columns: [

            { data: "departureTime", title: 'Departure Time', }

        ],
        processing: true,
        serverSide: true,
        pagingType: 'full_numbers',
        pageLength: 25,
    };
}

当页面加载时，我会看到表格标题（＆＃34;出发时间＆＃34;），我看到单词＆＃34; Processing ...＆＃34;。我看到Post请求，服务器响应如下（缩短）：

服务器响应

{"draw":1,
"recordsTotal":109,
"recordsFiltered":109,
"data":[ 
{"departureTime":"2:18 pm"},
{"departureTime":"2:55 pm"},
{"departureTime":"8:54 pm"},
{"departureTime":"9:10 pm"},
{"departureTime":"12:28 am"},
{"departureTime":"12:33 am"},
...
]}

我可以看到“成功”的结果。回调，但表格没有填充，并且＆＃39;处理...＆＃39;也继续显示。

任何想法？

谢谢

Answer 1

你的问题是success处理程序，删除它。您不需要type或contentType：

ajax: {
  url: "http://localhost:8880/nmets/api/manifest/search",
  error: function(xhr, error, code) { console.log(error); },
  data: function(data) {
    data['dto'] = this.manifest;
    return JSON.stringify(data);
  }.bind(this)
},

success处理程序绝不能被覆盖，因为DataTables在内部使用它。如果您需要成功处理程序，请使用dataSrc回调。请参阅 https://datatables.net/reference/option/ajax#Types

contentType是多余的，因为DatTables无论如何都会尝试解析响应。您可以设置type，这不是错误，但如果没有特别需要POST请求，那只是垃圾。

数据表的Angular 2/4服务器端处理不显示数据

1 个答案: