Question

我有一个模态，根据选择显示新数据。问题是，当我关闭模式时，它不会清除仅附加在其上的旧数据。理想情况下，我不会在每次按关闭按钮时清除模态。这是我尝试过的方法，但是不起作用。

    $scope.onCloseModal = function() {
    table = angular.element('#table-services');
    table.remove();
   }

这是附加到html的循环。

    angular.forEach($scope.payment_transaction_services,function(value,index) {
        var tr = angular.element('#table-services').append
        ('<tr>' + 
           '<td>' + value.title + '</td>' +
           '<td>' + value.delivered_by + '</td>' + 
           '<td>' + value.status + '</td>' + 
           '<td>' + value.delivery_date + '</td>' + 
         '</tr>'
        );
    })

这是我的模态。

    <div id="view-service-status" class="modal fade role="dialog">
<div class="modal-dialog" role="document">
    <!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h2 class="modal-title">Service Status</h2>
            </div>
            <div class="modal-body">
                <table class=" table table-bordered" id = "table-services">
                    <tr>
                        <th> <b> Service </b> </th>
                        <th> <b> Delivered By </b> </th>
                        <th> <b> Status </b> </th>
                        <th> <b> Delivered At </b> </th>
                    </tr>                        
                </table>
            </div>
            <div class="modal-footer view-service-status">
                <button type="button" class="btn btn-default"  data-dismiss="modal" ng-click="onClose()" class="close">Close</button>
            </div>
    </div>
 </div>

Answer 1

之所以发生这种情况，是因为您只是删除并再次获得相同的元素，而没有进行任何更改。在附加新数据之前，请尝试清空＃table-services元素。

类似这样的东西：

var tr = angular.element('#table-services');
tr.empty();
    angular.forEach($scope.payment_transaction_services,function(value,index) {
    tr.append
    ('<tr>' + 
       '<td>' + value.title + '</td>' +
       '<td>' + value.delivered_by + '</td>' + 
       '<td>' + value.status + '</td>' + 
       '<td>' + value.delivery_date + '</td>' + 
     '</tr>'
    );
})

删除我附加在模态上的内容

1 个答案: