首页 > Web开发 > 详细

angularjs 删除循环中的 promise 数据之后立马显示变化

时间:2015-02-03 17:22:14      阅读:386      评论:0      收藏:0      [点我收藏+]

在用 restangurlar 来跟后台 api 交互的时候,删除一条记录,但是直接显示在页面中。第三方异步的数据没办法立即同步,如果要看到删除的结果要重新刷新页面的话就太不 cool 了,google 了一把找到解决方法。

原始 js 代码如下:

.controller(‘HostCtrl‘, [‘$scope‘,‘Restangular‘,function($scope,Restangular) {
    var baseHosts = Restangular.all(‘api/host‘);

    $scope.hosts=baseHosts.getList().$object;

    $scope.del=function(host,uuid){
        Restangular.one(‘api/host‘,uuid).remove()
        }
}])

html:

<tbody>
<tr ng-repeat="host in hosts|filter:searchText">
    <td><a href="#" ng-if="host.Uuid!=nil" ng-click="del(host,host.Uuid)">delete</a> </td>
    <td class="center">{{host.Hostname}}</td>
    <td class="center">{{host.Ip}}</td>
    <td><p ng-repeat="tcp_port in host.Tcp_list">{{tcp_port}}</p></td>
    <td><p ng-repeat="udp_port in host.Udp_list">{{udp_port}}</p></td>
</tr>
</tbody>

修改后的 js 代码如下:

.controller(‘HostCtrl‘, [‘$scope‘,‘Restangular‘,function($scope,Restangular) {
    var baseHosts = Restangular.all(‘api/host‘);

    $scope.hosts=baseHosts.getList().$object;

    $scope.del=function(host,uuid){
        Restangular.one(‘api/host‘,uuid).remove().then(function(){
            var index=$scope.hosts.indexOf(host);
            if(index > -1) $scope.hosts.splice(index,1);
        })
        }
}])

angularjs 删除循环中的 promise 数据之后立马显示变化

原文:http://blog.csdn.net/smallfish1983/article/details/43450355

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!