AngularJS表切片

Question

如果我点击表格中的房间类型，会出现一个模态，我想点击删除按钮删除我来自的行。 所以我认为我应该使用slice使其工作，但不会删除该行。

让我知道我的代码中哪一部分是错误的。

controller.js

  $scope.modal1 = function (item, index) {

        if (item != undefined) { 
            vm.roomtypeModal.roomtypeId = item.roomtype.id;
            vm.roomtypeModal.Name = item.roomtype.abbrName;
            vm.roomtypeModal.rate = item.rate;
            vm.roomtypeModal.tax = item.tax;
            vm.roomtypeModal.fee = item.fee;
         console.log(item)
        } else { 

            vm.roomtypeModal = {
                id: vm.package.id,
                packageId: vm.package.id,
                roomtypeId: "",
                rate: null,
                tax: null,
                fee: null,
                roomtype: {
                    abbrName: ""
                }
            };
        }
    }

    function roomtypeSave() {
        var list = vm.packageRoomtypes.data();    
            list.push(vm.roomtypeModal);        

    }


    function roomtypeDel(index) {
      var list = vm.packageRoomtypes.data();
        list.slice(index,4);


    }

form.html

<div class="col-md-6">
    <div class="card-box clearfix">
        <div class="pull-left">
            <h5><i class="fa fa-caret-right"></i> Roomtype</h5>
        </div>
        <div class="pull-right">
            <button type="button" class="btn btn-default" data-toggle="modal" data-target="#con-close-modal2"  style="margin-bottom: 5px;" ng-click="modal1()">add</button>
        </div>

        <table class="table table-bordered m-0">
            <thead>
                <tr class="active">
                    <th class="text-center">Type</th>
                    <th class="text-center">Rate</th>
                    <th class="text-center">Tax</th>
                    <th class="text-center">Fee</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="package in mainCtrl.packageRoomtypes.data()">
                    <td class="text-center" data-toggle="modal" data-target="#con-close-modal2"  ng-click="modal1(package, $index)">{{package.roomtype.abbrName}}</td>
                    <td class="text-center">{{package.rate}}</td>
                    <td class="text-center">{{package.tax}}</td>
                    <td class="text-center">{{package.fee}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<div id="con-close-modal2" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
    style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">roomtype</h4>
            </div>
            <div class="modal-body">

                 <div ng-include src="'/admin2/views/package/roomtypemodal.html'"></div>
            </div>
            <div class="modal-footer">

                <div class="row">
                    <div class="col-md-12">
                        <div class="pull-right" style="margin-bottom: 5px;">
                             <button class="btn btn-primary" type="button" ng-click="mainCtrl.roomtypeSave()">save</button>
                             <button class="btn btn-default" type="button" ng-click="mainCtrl.roomtypeDel(index)">delete</button>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

Answer 1

你可以试试这个

<button class="btn btn-default" type="button" ng-click="mainCtrl.roomtypeDel($index)">delete</button>

在js

$scope.roomtypeDel  = function(index){
//
}

或者如果您使用controllerAs语法

vm.roomtypeDel = function(index){
//
}