智能 Table (AngularJs) 异步数据更改不更新

Question

我有一个 table，是在 AngularJs 中使用 Smart Table 制作的。

我正在尝试获取新数据并使用 ajax 添加到此 table。我在 ajax 回调中推送到 $scope.rowCollection。但是为什么新添加的数据没有显示在table中？（我正在使用 st-safe-src，我正在向 st-safe-src 中的集合添加新数据。）

另外一个问题是：每次st-safe-src改变的时候都要加上$scope.displayedCollection = [].concat($scope.rowCollection);吗？（添加这一行并不能解决问题）

我创建了带有超时的 Plunkr 来模拟 ajax 回调。

谢谢！

Answer 1

我通过更新超时代码修复了你的 plunkr，以便调用 $scope.$apply。您应该使用 $scope.$apply 来确保 angular JS 组件在您使用非 angular AJAX 调用时收到 angular JS 模型已更改的通知（像 jQuery) 或者核心 JS 回调（像 jQuery）：http://plnkr.co/edit/iI7zpSjmB2db4ryHuzp7?p=preview

      // use $timeout service so that we can automatically invoke 
      // the appropriate apply
      $timeout(function () {
        $scope.rowCollection.push({firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: 'whatever@gmail.com'});
        // do I need this?
        $scope.displayedCollection = [].concat($scope.rowCollection);
        console.log("executed");
      }, 2000, true);

您也可以按如下方式进行：

      setTimeout(function () {
        $scope.$apply(function () {
          $scope.rowCollection.push({firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: 'whatever@gmail.com'});
          // do I need this?
          $scope.displayedCollection = [].concat($scope.rowCollection);
        });
        console.log("executed");
      }, 2000);

智能 Table (AngularJs) 异步数据更改不更新

Smart Table (AngularJs) async data change not updating

ajax

angularjs

smart-table