智能表（AngularJs）异步数据更改未更新

Question

我有一张桌子，是在AngularJs中使用智能表制作的。

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

另一个问题是：我必须添加$scope.displayedCollection = [].concat($scope.rowCollection); 每次更改st-safe-src ？ （添加此行不能解决问题）

我用超时创建了这个Plunkr来模拟ajax回调。

谢谢！

Answer 1

我通过更新超时代码来修复您的plunkr，以便调用$scope.$apply 。 您应该使用$scope.$apply来确保在使用非角度AJAX调用（如jQuery）或使用核心JS回调（如jQuery）时通知角度JS组件已更改角度JS模型： 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);