data-ng-hide 指令
<!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-hide="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 = false; $scope.toggle = function () { $scope.myVar =!$scope.myVar}})
</script>
</body>
</html>
data-ng-hide 指令的更多相关文章
- Angular CLI ng常用指令整理
一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...
- Part 14 ng hide and ng show in AngularJS
ng-hide and ng-show directives are used to control the visibility of the HTML elements. Let us under ...
- ng 指令的自定义、使用
1.创建和使用var app = angular.module('myApp',['ng']);app.directive('指令名称',func); 自定义指令的命名:驼峰式,有两部分构成,前缀一般 ...
- [译]ng指令中的compile与link函数解析 转
通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神 ...
- vue之指令篇 ps简单的对比angular
这两天在开始vue的大型项目,发现和ng还是有许多不同,这里对比下两者的指令系统 难度系数:ng的指令难度大于vue:至少vue上暂时没发现@&=:require,compile,precom ...
- [Ng]Angular应用点概览
1. 使用模块化写法. var app = angular.module('myApp', []); app.controller('TextController', function($scop ...
- Angular 自定义拖拽指令
指令 组件是一种带模版的指令.指令是超级. 结构型指令(改变布局)和属性型指令(改变外观和行为). Renderer2和ElementRef Angular不提倡直接操作DOM 对于DOM的操作应该通 ...
- angular指令(二)--内置指令
一.基础ng 属性指令: ng-href ng-src ng-disabled ng-checked ng-readonly ng-selected ng-class ng-styl ...
- 走进AngularJs(五)自定义指令----(下)
自定义指令学习有段时间了,学了些纸上谈兵的东西,还没有真正的写个指令出来呢...所以,随着学习的接近尾声,本篇除了介绍剩余的几个参数外,还将动手结合使用各参数,写个真正能用的指令出来玩玩. 我们在自定 ...
- 走进AngularJs(四)自定义指令----(中)
上一篇简单介绍了自定义一个指令的几个简单参数,restrict.template.templateUrl.replace.transclude,这几个理解起来相对容易很多,因为它们只涉及到了表现,而没 ...
随机推荐
- JQuery选择器——《锋利的JQuery》
刚学CSS的时候我们已经接触了选择器,其实就是按照一定的规则选择出来我们想要获取到的元素.在这里,既然选择了用jQuery选择器,首先来谈谈JQuery选择器的优势: 1.简洁的写法:$()函数在很多 ...
- 电影:换肤(Replace)
一个恐怖题材的电影,欧美的恐怖电影给我的感觉是一点也不恐怖,只是血腥,非常血腥,看这部电影的时候我还在吃中午饭........ 开头没看懂,应该都是女主的幻觉吧,女主本来是一个年近六十多岁的老太太,然 ...
- solidity合约面向对象
1. 属性[状态变量]的访问权限 public internal[合约属性默认的权限] private 说明:属性默认访问全向为internal,internal和private类型的属性,外部是 ...
- jquery 获取easyui combobox选中的值、赋值
jquery easyui combobox 控件支持单选和多选 1.获取选中的值 $('#comboboxlist').combobox('getValue'); //单选时 $('#combob ...
- TensorFlow入门:mac 安装 TensorFlow
开发环境: mac os 10.12.5 Python 2.7.10 GCC 4.2.1 mac默认是不带pip的,安装pip. sudo easy_install pip 1.安装virtualen ...
- Django组件——分页器(paginator)
一.视图层 from django.shortcuts import render # Create your views here. from .models import Book from dj ...
- js CheckBox 全选、反选
<h3>你最喜欢的水果是?</h3> <label><input type="checkbox"/>苹果</label> ...
- sheepdog
- Windows 2012R2远程桌面服务简介
一.远程桌面服务概述 远程桌面服务加快并扩展了到任何设备的桌面和应用程序部署,在帮助保护关键知识产权的安全的同时提高了工作人员的工作效率,简化了法规遵从性. 远程桌面服务启用虚拟机基础结构 (VDI) ...
- March 1 2017 Week 9 Wednesday
If you are serious giving up something, giving up is not serious at all. 如果你慎重地决定要放弃,那么放弃本身就没什么大不了的. ...