Angular DTOptionsBuilder ajax调用完成时是否有回调?

时间:2016-09-05 19:52:12

标签: javascript angularjs ajax angular-datatables

我正在使用角度数据表,我有一些看起来像这样的代码:

this.dtOptions = DTOptionsBuilder.newOptions()
    .withOption('ajax', {
        type: 'POST',
        contentType: 'application/json',
        processData: false,
        beforeSend: function(xhr, settings) {
            ...
        },
        data: function(data) {
            ...
        }
    })
    .withDataProp('data')
    .withOption('processing', true)
    .withOption('serverSide', true);

当ajax调用返回时,一切正常并且页面上的表填充了数据。我现在要做的就是检测ajax调用何时完成。我试过在beforeSend下面使用这个:

success: function(data, textStatus, jqXHR, fnCallback) {
    console.log(data);
}

实际上将返回的数据打印到控制台,但是当我添加success回调时,页面上的表永远不会填充数据。那么当ajax完成后我怎么能有一个回调激发并且仍然让我的表格在页面上填充像往常那样的数据?

1 个答案:

答案 0 :(得分:3)

dataTables在内部使用ajax success回调,所以如果你覆盖它就会分解。但是,dataTables引入了自己的dataSrc回调,该回调是从dataTables成功处理程序中触发的,为您提供在插入任何数据之前操纵响应的机会:

this.dtOptions = DTOptionsBuilder.newOptions()
  .withOption('ajax', {
     dataSrc: function(json) {
       //success!
       console.log(json);
       return json
     },
     type: 'POST',
     contentType: 'application/json',
     processData: false,
     ....

参见演示 - >的 http://plnkr.co/edit/94EWyDanIawCJJgyagiy?p=preview

正如您在演示中看到的那样,您还可以在ajax complete回调中找到替代方案:

ajax : {
  complete: function(jqXHR, textStatus) {
    console.log(jqXHR.responseText)
  } 
  ..
}