angular.js中的复选框checkbox的用法

首先在head里引入

<script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js">script>

页面部分:

<div ng-app="myApp" ng-controller="myCtrl">
    <div>
        <label for="selectData">选中label>
        <input type="checkbox" 
            id="selectData" 
            ng-model="validData" 
            ng-click="selectOk($event)"
        >
    div>
div>
<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function ($scope) {
      
        $scope.validData = true;
        $scope.selectOk = function($event) {
      
            console.log("有效:" + $scope.validData);
            console.log($event.target.checked);
        }
    });
script>

在初始化的时候,validData值为true,则进入页面的时候复选框为选中状态
每次点击复选框值变化时,checked的值和$scope.validData的值随之变化,均为布尔值

页面上的效果:
在这里插入图片描述

你可能感兴趣的:(angular,checkbox,angularJs)