如何使用angularjs获取选中的复选框值和选定的下拉值？

Question

下面我在这里添加了我的代码，如果我按下提交按钮如何获取选中的复选框值并选择下拉列表值，我想获得。这里得到的选中复选框值是，但如果我在下拉列表中选择了一些优惠，例如选中了Samsung Galaxy S6，我们有一个Samsung Galaxy S6的报价，我在下拉列表中选择了Samsung Galaxy S6的20％Flat。当我提交“提交”按钮时，我需要选中复选框值并选中报价（Samsung Galaxy S6的20％Flat ）id .pls有人帮我演示

 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= [] ; for(var i=0;i<serverData.length;i++) { var modal = { name:serverData[i], selected:false }; $scope.items.push(modal); } //----------------------------Our Shop Offers---------------------------------------- $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.check = function() { var checkedItems = []; for(var i=0;i<$scope.items.length;i++) { if($scope.items[i].selected){ checkedItems.push($scope.items[i].name); } } console.log(checkedItems) ; } $scope.selection = []; $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].Offer_message); } } } } console.log($scope.offers); }; } 

 <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-model="item.selected" ng-checked="selection.indexOf(item) > -1" ng-click="toggleSelection(item)"/> {{item.name}} </div> <select ng-show="gotOffers.length > 0" > <option ng-repeat="offer in gotOffers" ng-model="offer" value="offer">{{offer}}</option> </select> <input type="button" name="submit" value="submit" ng-click="check()"/> </div> </div> 

Answer 1

您在选择中缺少ng-model ，因此无法使用它。 我也更新了您的代码以适合ng-options而不是ng-repeat on option 。

JSFiddle

码

 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.selectedOffer = []; for (var i = 0; i < serverData.length; i++) { var modal = { name: serverData[i], selected: false, }; $scope.items.push(modal); } //----------------------------Our Shop Offers---------------------------------------- $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.check = function() { var checkedItems = []; for (var i = 0; i < $scope.items.length; i++) { if ($scope.items[i].selected == true) { checkedItems.push({ name: $scope.items[i].name, offer: $scope.selectedOffer.Offer_message }); } } console.log(checkedItems) $scope.validOffers = []; for (var i = 0; i < checkedItems.length; i++) { var checkedModel = checkedItems[i]; for (var j = 0; j < $scope.offers.length; j++) { if ($scope.offers[j].modalname == checkedModel.name) { $scope.validOffers.push($scope.offers[j]); } } } if ($scope.validOffers.length > 0) { $scope.validOffers.unshift({ id: "0", Store: $scope.validOffers[0].Store, Offer_message: "Please Select Offer", modalname: $scope.validOffers[0].modalname, }) } } } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script> <div ng-app> <div ng-controller="Test1Controller"> <div ng-repeat="item in items"> <input ng-click="check()" type="checkbox" ng-model="item.selected" /> {{item.name}} </div> <div> <select ng-show="validOffers.length > 0" ng-model="selectedOffer" ng-options="offer.Offer_message for offer in validOffers"> </select> </div> <input type="button" name="submit" value="submit" ng-click="check()" /> </div> </div>