首页 > 解决方案 > 如何使用 AngularJs 删除数组项属性

问题描述

这是我的 AngularJs 代码

vm.selectedReviewer = [];
        // selected on a given reviewer by name
         function reviewerSelect(reviewer) {
            var idx = vm.selectedReviewer.indexOf(reviewer);
            // is currently selected
            if (idx > -1) {
                vm.selectedReviewer.splice(idx, 1);
            }
            // is newly selected
            else {              
                vm.selectedReviewer.push(reviewer);
            }
         }

html代码

<div>
                        <h3>With a simple array as input data</h3>                         
                        <div class="row">
                            <div class="col-md-6">                                   
                                <div class="form-group" ng-repeat="reviewer in vm.reviewerList">
                                    <label class="checkbox-inline">
                                        <input type="checkbox" name="selectedFruits[]" value="{{reviewer}}" ng-checked="vm.selectedReviewer.indexOf(reviewer) > -1" ng-click="vm.reviewerSelect(reviewer)"> {{reviewer.Name}}                                       
                                        <input type="text" name="TotalReviewMargin" ng-model="reviewer.ReviewCollectMargin">
                                        <input type="text" name="TotalReviewMargin" ng-model="reviewer.PerReviewCost">
                                    </label>
                                </div>
                            </div>                           
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <h4>selected Reviewer</h4>
                                <pre>{{vm.selectedReviewer|json}}</pre>
                            </div>                               
                        </div>
                    </div>

这是我的输出

一切都运行良好,但我想从选定的项目中删除一些项目属性。当复选框被选中时,我的预期输出Click Here。这次当项目推入数组时,某些属性未推入数组。这个怎么做?

标签: angularjs

解决方案


据我了解,您需要删除对象的某些属性。看看这个小提琴

您可以创建对象的深层副本,这样它就不会影响reviewerList使用:

  var tempObj = JSON.parse(JSON.stringify(reviewer));
  delete tempObj.TotalReviewMargin;
  this.selectedReviewer.push(tempObj);

所以,虽然你有

this.reviewerList = [
  {name: "test", ReviewCollectMargin: 10, PerReviewCost: 12,TotalReviewMargin : 0},
  {name: "test2", ReviewCollectMargin: 10, PerReviewCost: 12 ,TotalReviewMargin : 0},
  {name: "test3", ReviewCollectMargin: 10, PerReviewCost: 12,TotalReviewMargin : 0}
];

单击复选框时,您将获得:

[
 {
  "name": "test",
  "ReviewCollectMargin": 10,
  "PerReviewCost": 12
 }
]

请注意TotalReviewMargin所选值中缺少该属性


推荐阅读