<!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 指令的更多相关文章

  1. Angular CLI ng常用指令整理

    一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...

  2. 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 ...

  3. ng 指令的自定义、使用

    1.创建和使用var app = angular.module('myApp',['ng']);app.directive('指令名称',func); 自定义指令的命名:驼峰式,有两部分构成,前缀一般 ...

  4. [译]ng指令中的compile与link函数解析 转

    通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神 ...

  5. vue之指令篇 ps简单的对比angular

    这两天在开始vue的大型项目,发现和ng还是有许多不同,这里对比下两者的指令系统 难度系数:ng的指令难度大于vue:至少vue上暂时没发现@&=:require,compile,precom ...

  6. [Ng]Angular应用点概览

      1. 使用模块化写法. var app = angular.module('myApp', []); app.controller('TextController', function($scop ...

  7. Angular 自定义拖拽指令

    指令 组件是一种带模版的指令.指令是超级. 结构型指令(改变布局)和属性型指令(改变外观和行为). Renderer2和ElementRef Angular不提倡直接操作DOM 对于DOM的操作应该通 ...

  8. angular指令（二）--内置指令

    一.基础ng 属性指令:  ng-href ng-src ng-disabled ng-checked ng-readonly ng-selected ng-class ng-styl ...

  9. 走进AngularJs(五)自定义指令----（下）

    自定义指令学习有段时间了,学了些纸上谈兵的东西,还没有真正的写个指令出来呢...所以,随着学习的接近尾声,本篇除了介绍剩余的几个参数外,还将动手结合使用各参数,写个真正能用的指令出来玩玩. 我们在自定 ...

  10. 走进AngularJs(四)自定义指令----（中）

    上一篇简单介绍了自定义一个指令的几个简单参数,restrict.template.templateUrl.replace.transclude,这几个理解起来相对容易很多,因为它们只涉及到了表现,而没 ...

随机推荐

  1. QQ音乐：React v16 新特性实践

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由QQ音乐技术团队发表于云+社区专栏 自从去年9月份 React 团队发布了 v16.0 版本开始,到18年3月刚发布的 v16.3 版 ...

  2. vim创建新的命令

    转自:http://man.chinaunix.net/newsoft/vi/doc/usr_5F40.html#usr_40.txt *40.1* 键映射 简单的映射已经在 |05.3| 介绍过了. ...

  3. BNU7538——Clickomania——————【区间dp】

    Clickomania Time Limit: 10000ms Memory Limit: 32768KB 64-bit integer IO format: %I64d      Java clas ...

  4. [转]NLog学习笔记二：深入学习

    本文转自:http://www.cnblogs.com/CCHUncle/p/5207735.html 配置文件 NLog所有的配置信息都可以写到一个单独的xml文件中,也可以在程序代码中进行配置. ...

  5. 程序员心灵鸡汤桌面壁纸1080p 欢迎大家下载，HTML，PHP，node，css，前端

    上段时间在读书的时候看见了一句话:一张地图,不论比例多么精确,它永远不可能带着主人在地面上移动半步, 作为爱思考,爱学习的程序员 突然想到了:一份帮助文档,不论多么详细,它永远不会帮助主人敲一行代码. ...

  6. hibernate open session in view 抛出异常解决方法

    在使用open-session-in-view的时候,如果使用不当,有可能抛出两种异常1,NonUniqueObjectException2,在配合spring使用的时候会可能会抛出org.sprin ...

  7. 初学orcale（一）

    Oracle数据库学习: 01.数据库简介: (1)文件型数据库: Access Office组件: Foxpro (2)NoSql数据库(泛指非关系型数据库): NoSQL(NoSQL = Not ...

  8. sql and csharp: Split Function

    T-SQL: declare @int int,@prov int,@city int,@str nvarchar(500) set @str='天河麗特青春:中國廣東省廣州市天河區天河路623號天河 ...

  9. 关于Activity

    Activity与界面 1.Activity相当于浏览器的标签.相当于空白的网页,界面相当于浏览器内的网页. 2.将Activity与界面绑定就相当于在浏览器内填写了相应的网页. 3.Activity ...

  10. 3、HTML属性

    属性的意义是为HTML提供附加信息. 属性中,名称和值总是成对出现.比如 <img src="1" width="2" /> src="1 ...