angular動態刪除ng-repaeat添加的dom節點

通過點擊刪除按鈕刪除數據庫信息以及當前行

html代碼如下:

<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <div class="row">
            <div class="col-xs-12">
                <table id="simple-table" class="table  table-bordered table-hover">
                    <thead>
                    <tr>
                        <th>姓名</th>
                        <th>學歷</th>
                        <th class="hidden-480">專業</th>

                        <th>
                            <i class="ace-icon fa fa-clock-o bigger-110 hidden-480"></i>
                            工作時間
                        </th>
                        <th class="hidden-480">工作經歷</th>

                        <th></th>
                    </tr>
                    </thead>

                    <tbody>
                    <tr ng-repeat="x in jl" class="hang">//通過ng-repeat迭代創建dom
                        <td>
                            <a href="#">{{x.name}}</a>
                        </td>
                        <td>{{x.education}}</td>
                        <td class="hidden-480">{{x.major}}</td>
                        <td>{{x.workYear+'年'}}</td>

                        <td class="hidden-480">
                            {{x.workExperience}}
                        </td>

                        <td>
                            <div class="hidden-sm hidden-xs btn-group">
                                <button class="btn btn-xs btn-success">
                                    <i class="ace-icon fa fa-check bigger-120"></i>
                                </button>

                                <button class="btn btn-xs btn-info">
                                    <i class="ace-icon fa fa-pencil bigger-120"></i>
                                </button>

                                <button class="btn btn-xs btn-danger" ng-click="_delete($index)">
                                    <i class="ace-icon fa fa-trash-o bigger-120"></i>
                                </button>

                                <button class="btn btn-xs btn-warning">
                                    <i class="ace-icon fa fa-flag bigger-120"></i>
                                </button>
                            </div>

                            <div class="hidden-md hidden-lg">
                                <div class="inline pos-rel">
                                    <button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown" data-position="auto">
                                        <i class="ace-icon fa fa-cog icon-only bigger-110"></i>
                                    </button>

                                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow dropdown-menu-right dropdown-caret dropdown-close">
                                        <li>
                                            <a href="#" class="tooltip-info" data-rel="tooltip" title="View">
                                                                            <span class="blue">
                                                                                <i class="ace-icon fa fa-search-plus bigger-120"></i>
                                                                            </span>
                                            </a>
                                        </li>

                                        <li>
                                            <a href="#" class="tooltip-success" data-rel="tooltip" title="Edit">
                                                                            <span class="green">
                                                                                <i class="ace-icon fa fa-pencil-square-o bigger-120"></i>
                                                                            </span>
                                            </a>
                                        </li>

                                        <li>
                                            <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete">
                                                                            <span class="red">
                                                                                <i class="ace-icon fa fa-trash-o bigger-120"></i>
                                                                            </span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div><!-- /.span -->
        </div><!-- /.row -->

        <!-- PAGE CONTENT ENDS -->
    </div><!-- /.col -->
</div>
<!-- /.row -->

js代碼如下:

angular.controller('tables',function ($scope,$http) {
    $http({
        method: 'GET',
        url:'resumes/myResume/'+USER.id
    }).then(function success(rep) {
        $scope.jl=rep.data;
    });

    $scope._delete=function (idx) {
        $scope.id=$scope.jl[idx].id;
        $http({
           method:'DELETE',
           url:'resumes/'+$scope.id
        }).then(function success(rep) {
            $scope.jl.splice(idx, 1);//截取數組，刪除當前行
        });
    }
});