AngularJs 如何在不重新加载页面的情况下更新数据 table

AngularJs How to update data table without reloading page

我的控制器中有以下从数据库获取对象的数组:

this.objects = [ //data of array goes here ];

然后我有一个 html table:

<tbody ng-repeat="object in object.recipients>
    <tr>
        <td>{{object.attribute.content}}</td>
    </tr>
</tbody>

table 显示正确。我有一个删除按钮,可以从数据库中删除对象。但是为了在我的 table 上看到变化,我需要刷新页面。如何在不刷新的情况下更新我的 table?

在你的删除项函数中,从数组中拼接项后,将数据保存到你的数据库中,然后立即使用ajax将新数据集GET回来。 将数据保存到数据库后,使用:

$http.get(...)

获取新数据并更新 array/table(应有的方式),而无需刷新页面。

  1. 当您删除数据库中的记录时。您应该从重新加载数据 $http 并为 $scope.objects.
  2. 设置数据
  3. 或使用删除

    $scope.objects = $scope.objects.slice(1); // 1 是 索引对象

    然后删除数据库中的记录。

只需使用执行以下操作的控制器功能进行删除:

this.objects.splice(index, 1)

并在 html 中的删除按钮中调用删除函数并传递索引或其他唯一 ID。例如

<button ng-click="deleteThis($index)">Delete</button>

$index指的是ng-repeat中的当前索引

如果您愿意,可以从您的服务器中删除,如果 callback/promise 成功解决,则按照上述说明从视图中删除