data-ng-show 指令
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport"content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.5/dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<button type="button" class="btn btn-success btn-sm"data-ng-click="toggle()">隐藏/显示</button><br /><br />
<form class="form-horizontal" data-ng-show="myVar">
名:<input type="text" data-ng-model="fName" /><br />
姓:<input type="text" data-ng-model="lName" /><br /><br />
<p>{{fName+" "+lName}}</p>
</form>
</div>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5/dist/js/bootstrap.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myApp", []).controller("myCtrl", function ($scope) { $scope.fName = "Visual"; $scope.lName = "Studio 2015"; $scope.myVar = true; $scope.toggle = function () { $scope.myVar =!$scope.myVar}})
</script>
</body>
</html>
最新文章
- 【社工】NodeJS 应用仓库钓鱼
- [No0000AC]全局鼠标键盘模拟器
- 《C++ API设计》作者Martin Reddy访谈问题征集
- Types of intraclass correlation coefficience (ICC)
- nmap 高级扫描用法
- php 基础复习(2)GD库
- Google 发布 Android 性能优化典范
- MyBatis总结-实现关联表查询
- php form表单post提交获取不到数据,而使用get提交能获取到数据 的解决办法
- (原)使用mkl计算特征值和特征向量
- Voilin 之 握弓
- [LeetCode] Rectangle Overlap 矩形重叠
- 配置数据库方言——hibernate
- vue之简单的todoList(一)
- nodejs和ionic小助手
- saltstack自动化运维系列④之saltstack的命令返回结果mysql数据库写入
- CAP与Base理论
- C语言:逻辑推理
- java中4种修饰符访问权限的区别
- Centos中使用Jenkins执行gulp命令:command not found