Question

我正在使用AngularJS和angular-datatable库。我需要在点击行时调用模态。这是我的代码部分：

  function rowCallback(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
    // Unbind first in order to avoid any duplicate handler (see https://github.com/l-lin/angular-datatables/issues/87)
    $('td', nRow).unbind('click');
    $('td', nRow).bind('click', function() {
      console.log(aData.title);
      $timeout(function(){
        Modal.showModal({
         template : 'views/Modal.html',
         Data : aData
         });
      }, 0);
    });
    return nRow;
  }

console.log函数可以正常工作，但调用模态函数只有在超时时才会按预期工作。那么有人可以解释为什么会这样吗？为什么只有第一个功能有效？我将不胜感激任何解释。

Answer 1

您需要$timeout的原因是因为您正在使用带角度函数的jQuery事件。这通常是一个坏主意，而且违反了角度设计原则 - 使用ng-click。

如果必须将jQuery和angular混合在一起，那么请确保通过使角度感知jQuery事件来正确地执行它，以便它可以触发其摘要周期。

您可以通过几种方式触发摘要，但最简单的（最明显的是您的代码正在做什么）是使用$scope.$apply：

$scope.$apply(function () {

  Modal.showModal({
   template : 'views/Modal.html',
   Data : aData
  });

});

$timeout工作的原因是因为$timeout是一个角度包装函数，它触发摘要周期作为其实现的一部分（它实际上与$scope.$apply非常相似，但是，当您稍后查看代码时，它的行为/为什么不那么明显，所以我建议使用$scope.$apply代替。

进一步阅读：ng-book。

Answer 2

浏览器渲染引擎何时完成渲染页面时没有回调。

但渲染页面是由事件队列处理的。通过使用$ timeout函数，您将Modal.showModal分配给事件队列的 end - 在已经排队的页面呈现方法之后。

因此，在页面渲染并正常工作后，将调用Modal.showModal。

为什么我需要使用超时？

2 个答案: