[英]How to set default checked in multiple checkbox - AngularJS
var demoApp = angular.module('myApp', []); demoApp.controller('QaController', function($scope, $http) { $scope.technologies = [ {id:1, name:'PHP'}, {id:2, name:'DOTNET'}, {id:3, name:'JAVA'}, {id:4, name:'ORACLE'}, {id:5, name:'ROR'}, {id:6, name:'PYTHON'}, {id:7, name:'C'}, {id:8, name:'MYSQL'}, {id:9, name:'HTML'}, {id:10, name:'SQL'}, ]; $scope.existed = [ {id:1, name:'PHP'}, {id:8, name:'MYSQL'}, {id:9, name:'HTML'} ]; $scope.submit = function() { $scope.result = $scope.loopData; }; });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="myApp"> <div class="wrapper wrapper-content middlealigen col-sm-12" ng-controller="QaController"> <div ng-repeat="technology in technologies"> <input type="checkbox" ng-model="technology.checked" id="technology{{$index}}" ng-checked="technology.id==existed[$index].id" /> <label for="technology{{$index}}" ng-bind="technology.name"></label> </div> </div> </body>
上面我貼了示例示例。 我共有10項技術。 我想默認檢查$scope.existed變量中包含的PHP ， HTML和MYSQL 。
請幫我。
創建一個函數並在ng-checked調用
$scope.checkID = function(name){
var dat = $scope.existed.find(o=> o.name === name);
if(dat) {return true }else{ return false}
}
<input type="checkbox" ng-model="technology.checked" id="technology{{$index}}" ng-checked="checkID(technology.name)" />
var demoApp = angular.module('myApp', []); demoApp.controller('QaController', function($scope, $http) { $scope.technologies = [ {id:1, name:'PHP'}, {id:2, name:'DOTNET'}, {id:3, name:'JAVA'}, {id:4, name:'ORACLE'}, {id:5, name:'ROR'}, {id:6, name:'PYTHON'}, {id:7, name:'C'}, {id:8, name:'MYSQL'}, {id:9, name:'HTML'}, {id:10, name:'SQL'}, ]; $scope.existed = [ {id:1, name:'PHP'}, {id:8, name:'MYSQL'}, {id:9, name:'HTML'} ]; $scope.checkID = function(name){ var dat = $scope.existed.find(o=> o.name === name); if(dat) {return true }else{ return false} } $scope.submit = function() { $scope.result = $scope.loopData; }; });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="myApp"> <div class="wrapper wrapper-content middlealigen col-sm-12" ng-controller="QaController"> <div ng-repeat="technology in technologies"> <input type="checkbox" ng-model="technology.checked" id="technology{{$index}}" ng-checked="checkID(technology.name)" /> <label for="technology{{$index}}" ng-bind="technology.name"></label> </div> </div> </body>
在模型中添加選中的密鑰
{id:1, name:'PHP', checked:true},
並刪除ng-checked
工作版本
var demoApp = angular.module('myApp', []); demoApp.controller('QaController', function($scope, $http) { $scope.technologies = [ {id:1, name:'PHP', checked:true}, {id:2, name:'DOTNET'}, {id:3, name:'JAVA'}, {id:4, name:'ORACLE'}, {id:5, name:'ROR'}, {id:6, name:'PYTHON'}, {id:7, name:'C'}, {id:8, name:'MYSQL', checked:true}, {id:9, name:'HTML'}, {id:10, name:'SQL'}, ]; $scope.submit = function() { $scope.result = $scope.loopData; }; });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="myApp"> <div class="wrapper wrapper-content middlealigen col-sm-12" ng-controller="QaController"> <div ng-repeat="technology in technologies"> <input type="checkbox" ng-model="technology.checked" id="technology{{$index}}" /> <label for="technology{{$index}}" ng-bind="technology.name"></label> </div> </div> </body>
如何使用AngularJS在數據庫的復選框中設置默認值
[英]How to set default value checked in a checkbox from database using AngularJS
如何復選框選中默認的單個和多個復選框？ ng-init=“checkboxModel.value=true” 它不工作
[英]How to checkbox checked default single and multiple checkbox? ng-init=“checkboxModel.value=true” its not working
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.