angularJs复选框checkbox选中进行ng-show显示隐藏的方法
更新时间：2018年10月08日 09:55:53 作者：泠泠在路上
今天小编就为大家分享一篇angularJs复选框checkbox选中进行ng-show显示隐藏的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
如下所示：
ng-true-value="1" //代表选中的时候，值为1 ng-false-value="0" //代表未选中的时候，值为0
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="angular.min.js"></script>
</head>
<body>
<div ng-app="module" ng-controller="ctrl">
游戏: <input type="checkbox" ng-model="data.game" ng-true-value="1" ng-false-value="0">
电影: <input type="checkbox" ng-model="data.video" ng-true-value="1" ng-false-value="0">
<div ng-show="data.game==1">
<h1>游戏被选中</h1>
</div>
<div ng-show="data.video==1">
<h1>电影被选中</h1>
</div>
</div>
<script>
var m = angular.module('module', []);
m.controller('ctrl', ['$scope', function ($scope) {
$scope.data = {game: 0, video: 0}; //初始化未选中，值为0
}]);
</script>
</body>
</html>
以上这篇angularJs复选框checkbox选中进行ng-show显示隐藏的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
Angular2 组件间通过@Input @Output通讯示例
本篇文章主要介绍了Angular2 组件间通过@Input @Output通讯示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
AngularJs Creating Services详解及示例代码
本文主要介绍AngularJs Creating Services的知识资料，这里整理了详细的资料及简单示例代码，有需要的小伙伴可以参考下2016-09-09
这篇文章主要介绍了Angular.JS读取数据库数据调用,结合完整实例形式分析了AngularJS使用$http.get方法与后台php交互读取数据库数据相关操作技巧,需要的朋友可以参考下2019-07-07
这篇文章主要为大家分享了10个大家不能不知道的angularjs英文网站，供大家学习，感兴趣的小伙伴们可以参考一下2016-03-03
本文主要介绍AngularJS 视图，这里整理了相关知识，并附代码示例和实现效果图，有兴趣的小伙伴可以参考下2016-08-08
详解angularJs中关于ng-class的三种使用方式说明
本篇文章主要介绍了angularJs中关于ng-class的三种使用方式说明，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
本文主要对Angular的模块化进行案例分析介绍，具有一定的参考价值，下面跟着小编一起来看下吧2016-12-12
v-bind与{{}}都可以对数据进行绑定，接下来通过本文给大家介绍AngularJs模版与v-bind的相关知识，感兴趣的朋友一起看看吧2018-07-07
这篇文章主要介绍了angular 服务随记小结,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
本篇文章主要介绍了Angular2自定义分页组件的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧2017-04-04
最新评论