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.6-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<input type="checkbox" data-ng-model="mySwitch" /><p data-ng-hide="mySwitch">选中复选框我就消失</p>
</div>
</div>
<script src="jQuery/jquery-2.1.4.min.js"></script>
<script src="bootstrap-3.3.6-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.mySwitch=false})
</script>
</body>
</html>

时间： 2024-10-12 16:47:37

data-ng-hide指令的相关文章

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 understand this with an example When Hide Salary checkbox is checked, the Salary column should be hidden. When it is unchecked the Salary column should be

ng 指令的自定义、使用

1.创建和使用var app = angular.module('myApp',['ng']);app.directive('指令名称',func); 自定义指令的命名:驼峰式,有两部分构成,前缀一般是公司或者项目的缩写,后缀表示的为指令的作用(tsHello)使用指令时:采用烤串式的方式去使用(ts-hello) 2.高级 属性:①template 显示的模板内容②restrict: 'EACM' (E:元素A:属性C:类M:注释)作为注释去调用自定义指令时,需要设置replace属性为tru

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

通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神奇,允许你创建非常语义化以及高度重用的组件,可以理解为web components的先驱者. 网上已经有很多介绍怎么使用指令的文章以及相关书籍,相互比较的话,很少有介绍compile与link的区别,更别说pre-link与post-link了. 大部分教程只是简单的说下compile会在ng内部用

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

这两天在开始vue的大型项目,发现和ng还是有许多不同,这里对比下两者的指令系统 难度系数:ng的指令难度大于vue:至少vue上暂时没发现@&=:require,compile,precompile,postcompile之类的小型地雷... 这篇文章只看表象:何为指令?这里借助ng的解释来解释vue,就是当你的项目中,需要一些dom操作,并且MVMM自带的事件指令感觉麻烦的时候,可以把一些dom操作封装到一个公共方法,这就是指令,大概用在vue上也可以说个70%: 写法,vue: Vue.d

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

一.基础ng 属性指令: ? ng-href? ng-src? ng-disabled? ng-checked? ng-readonly? ng-selected? ng-class? ng-style 布尔属性的有: ng-disabled.ng-readonly.ng-checked.ng-selected 类布尔属性有: ng-href.ng-src 二.在指令中使用子作用域 ? ng-app ? ng-controller ? ng-include 使用ng-include可以加载.编译

[Ng]Angular应用点概览

----------------------------------------------------------------------------------------------------- 1. 使用模块化写法. var app = angular.module('myApp', []); app.controller('TextController', function($scope) { $scope.txt = {'title':'some txt'}; }); ng-mod

Angularjs[25] - 自定义指令（1）（restrict, template, replace）

自定义指令: module.directive(name,directiveFactory) @see $compileProvider.directive() ??  不要使用 ng 为指令,若指令名为 xxx-yyy,在设置指令名时应为 xxxYyy 即驼峰命名法. restrict: 可以任意组合四种风格,如果忽略 restrict,默认为A. 字母 风格 示例 E 元素 <my-dir></my-dir> C 样式类 <span class="my-dir:

AngularJS指令中的compile与link函数解析

AngularJS指令中的compile与link函数解析 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. 原文地址 angularjs里的指令非常神奇,允许你创建非常语义化以及高度重用的组件,可以理解为web components的先驱者. 网上已经有很多介绍怎么使用指令的文章以及相关书籍,相互比较的话,很少有介绍compile与link的区别,更别说pre-link与post-lin

angularjs指令中的compile详解

篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. angularjs里的指令非常神奇,允许你创建非常语义化以及高度重用的组件,可以理解为web components的先驱者. 网上已经有很多介绍怎么使用指令的

【转】angularjs指令中的compile与link函数详解

这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. angularjs里的指令非常神奇,允许你创建非常语义化以及高度重用的组件,可以理解为web components的先驱者. 网上已经有很多介绍怎么使用指令