javascript - 如何使用 angularjs 提交后获取选中的复选框值？

Question

当我提交时，我有一些包含一些报价的复选框列表，必须获取选中的复选框值。我已经尝试过，但它不起作用，我在下面添加了我的代码。现在我收到了报价消息 ID，但提交后我没有得到选中的复选框值请帮助我。 demo

function Test1Controller($scope) {
    var storeid = window.localStorage.getItem("storeid");
    var serverData = ["Samsung Galaxy Note", "Samsung Galaxy S6", "Samsung Galaxy Avant","Samsung Galaxy Young"];
    $scope.items= [] ;
    $scope.selection = [];    
    $scope.offers = [{
        id: "as23456",
        Store: "samsung",
        Offer_message:"1500rs off",
        modalname: "Samsung Galaxy Young"       

    },{
        id: "de34575",
        Store: "samsung",
        Offer_message:"20% Flat on Samsung Galaxy S6",
        modalname: "Samsung Galaxy S6"       
    },]
    
    $scope.toggleSelection = function toggleSelection(item) {
        $scope.gotOffers=[];
        var idx = $scope.selection.indexOf(item);

        // is currently selected
        if (idx > -1) {
            $scope.selection.splice(idx, 1);
        }

        // is newly selected
        else {
            $scope.selection.push(item);
        }

        for(var i=0;i<$scope.selection.length;i++){
            for(var j=0;j<$scope.offers.length;j++){
                console.log($scope.selection[i].name  +"   "+ $scope.offers[j].modalname)
                if( $scope.selection[i].name == $scope.offers[j].modalname){
                    var idx = $scope.gotOffers.indexOf($scope.offers[j].Offer_message);
                    if(idx == -1){
                        console.log("inside idx")
                        $scope.gotOffers.push($scope.offers[j]);
                    }
                }
            }
        }
		console.log($scope.offers);
    };
    
	var selectedvalue = window.localStorage.getItem("selectedvalue");
	// here selected value Samsung Galaxy S6
    var selectedvalue="Samsung Galaxy S6,Samsung Galaxy Young";
    for(var i=0;i<serverData.length;i++){
        var modal = {
            name:serverData[i],
            selected:false
        };  
		if (selectedvalue.indexOf(serverData[i]) >= 0 || null){
            $scope.toggleSelection(modal);
        }
        $scope.items.push(modal);        
    }
    //----------------------------Our Shop Offers----------------------------------------
    $scope.check = function(){
        var checkedItems = [];
        console.log($scope.offerSelected)
        for(var i=0;i<$scope.items.length;i++){
            if($scope.items[i].selected){
                checkedItems.push($scope.items[i].name);
            }
        }
        console.log(checkedItems) ; 
    }
}	

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<div ng-app>
    <div ng-controller="Test1Controller" >
        <div ng-repeat="item in items">
            <input type="checkbox"  ng-checked="selection.indexOf(item) >= 0" ng-click="toggleSelection(item)"/> {{item.name}}
        </div>
        <select ng-show="gotOffers.length > 0" ng-model="offerSelected">
            <option ng-repeat="offer in gotOffers"  value="{{offer.id}}">{{offer.Offer_message}}</option>
        </select>
        <input type="button" name="submit" value="submit" ng-click="check()"/>
    </div>
</div>

Answer 1

您似乎想要迭代 $scope.selection 而不是 $scope.items。

Updated Example

更改:

var checkedItems = [];$scope.selection
for (var i = 0; i < $scope.items.length; i++) {
  if ($scope.items[i].selected) {
    checkedItems.push($scope.items[i].name);
  }
}

至:

var checkedItems = [];
for (var i = 0; i < $scope.selection.length; i++) {
  checkedItems.push($scope.selection[i].name);
}

由于已检查 $scope.selection 中的所有元素，因此删除了 if 条件语句。

<小时/>

或者，您也可以仅使用 .map() 方法来创建数组:

Updated Example

var checkedItems = $scope.selection.map(function(checkbox) {
  return checkbox.name;
});