单击标签获取复选框内的值

我在标签里面有一个复选框，为了设计的目的，我在那里添加了div。我的要求是得到复选框值onclick事件的标签，现在我得到false所有时间复选框点击事件

<label class="text-xs col-xs-4 switch">
  <input type="checkbox" ng-model="inAtlas"> 
  <div class="slider round"></div>                                  
</label>

我想在点击label时得到$scope.inAtlas的值。

下面是一个演示-请注意:

当您使用label切换单选按钮/复选框时，不要忘记使用id和for将label链接到input。
将inAtlas的值初始化为false(或根据需要为true)，否则您将获得undefined，直到您第一次切换复选框。

var app = angular.module("test", []); 
app.controller("test", function($scope){
  $scope.inAtlas = false; /*better to do this - or undefined till you toggle the checkbox*/
  $scope.getValue = function(){
    console.log($scope.inAtlas);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body ng-app="test" ng-controller="test">
  <label class="text-xs col-xs-4 switch" for="check-box">
    <input type="checkbox" ng-model="inAtlas" id="check-box">
    <span class="slider round">Toggle me</span>
  </label>
  <br><br>
  <button ng-click="getValue()">Get checkbox value</button>
</body>

如果您有任何疑问，请告诉我，谢谢!

相关内容

最新更新

热门标签：