指令(Directive)

1、指令概念介绍

--  AngularJS有一套完整的、可扩展的、用来帮助web应用开发的指令集。

--  在DOM编译期间和HTML关联着的指令会被检测到,并且 会被执行。

--  在AngularJS中间前缀ng- 这种属性称之为指令,其作用就是为DOM元素调用方法、定义行为绑定数据等。

--  简单地说,当一个Angular应用启动,Angular就会遍历DOM树来解析HTML,根据指令不同,完 成不同操作。

--  HTML5允许扩展的(自制的)属性,以data-开头。

--  AngularJS 属性以ng- 开头,但是可以使用data-  ng- 来让网页对HTML5有效。

2、ng-app 指令

--  ng-app指令用来标明一个AngularJS应用程序。

--  标记在一个AngularJS的作用范围的根对象上。

--  系统执行时会自动的执行根对象范围内的其他指令。

--  可以在同一个页面创建多个ng-app 节点。

3、ng-repeat指令

--  ng-repeat指令用来编译一个数组重复创建当前元素,如:

4、ng-class指令

--  ng-class指令可以设置一个键值对,用于决定是否添加一个特定的类名,键为class名,值为bool 类型表示是否添加该类名,如:

5、ng-show、ng-hide指令

--  ng-show、ng-hide指令会根据属性值确定是否展示当前元素,例如ng-show=false则不会展示 该元素

6、ng-if 是指是否存在DOM元素

7、ng-link、ng-src指令

--   ng-link、ng-src指令用于解决当链接类型的数据绑定时造成的加载BUG,如:

8、其他常用指令

--  ng-model

--  ng-click

--  ng-init

angular之指令的更多相关文章

  1. Angular自定义指令(directive)

    angular自定义指令,意我们可以通过angula自己定义指令,来实现我们的特殊要求,为所欲为,一支穿云箭,千军万马来相见 多少年的老规矩了,先看代码: <!DOCTYPE html> ...

  2. angular 自定义指令详解 Directive

    在angular中,Directive,自定义指令的学习,可以更好的理解angular指令的原理,当angular的指令不能满足你的需求的时候,嘿嘿,你就可以来看看这篇文章,自定义自己的指令,可以满足 ...

  3. Angular学习-指令入门

    1.指令的定义 从用户的角度来看,指令就是在应用的模板中使用的自定义HTML标签.指令可以很简单,也可以很复杂.AngularJS的HTML编译器会解析指令,增强模板的功能.也是组件化未来的发展趋势, ...

  4. angular 自定义指令 directive transclude 理解

    项目中断断续续的用了下angular,也没狠下心 认真的学习.angular 特别是自定义指令这块 空白. transclude 定义是否将当前元素的内容转移到模板中.看解释有点抽象. 看解释有点抽象 ...

  5. Angular自定义指令directive:scope属性

    在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...

  6. angular directive指令的复用

    “指令之之所以要定义成指令就是为了复用!” 指令一定是可以用在不同的controller里面的,为了在不同的controller去使用它,我们一定要给指定的配置项一个指令.这样才能跟外面的控制器进行交 ...

  7. angular js 指令的数据传递 及作用域数据绑定

    <div my-directive my-url="http://google.com" my-link-text="Click me to go to Googl ...

  8. angular分页指令

    目前的多个项目中都用到分页这个功能,为了提高可复用性,我特地分离出来写了个分页的指令.直接贴代码,详情如下: index.html <body id="sBill" ng-c ...

  9. angular自定义指令详解

    指令(directive)是angular里面最核心也是最难懂的东西,在慕课网看了下大漠穷秋老湿的视频,自己百度半天做了一些小test,总算把一切都搞明白了. 先列出学习来源: 指令中controll ...

  10. Angular之指令Directive系列

    项目筹备近期开启Angular学习,指令比较难理解所以记录备案,推荐Angualr实战学习视频大漠穷秋 Angular实战 一.指令directive概述 指令可以对元素绑定事件监听或者改变DOM结构 ...

随机推荐

  1. Apache Hadoop 2.9.2 的集群管理之服役和退役

    Apache Hadoop 2.9.2 的集群管理之服役和退役 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 随着公司业务的发展,客户量越来越多,产生的日志自然也就越来越大来,可能 ...

  2. IDEA2019激活码集合(非盈利)

    56ZS5PQ1RF-eyJsaWNlbnNlSWQiOiI1NlpTNVBRMVJGIiwibGljZW5zZWVOYW1lIjoi5q2j54mI5o6I5p2DIC4iLCJhc3NpZ25lZ ...

  3. JS 条形码插件--JsBarcode 在小程序中使用

    在小程序中的使用: utils文件夹下 barcode.js 粘粘以下代码 var CHAR_TILDE = 126 var CODE_FNC1 = 102 var SET_STARTA = 103 ...

  4. 安卓ADB学习笔记

    ADB(Android Debug Bridge)可以远程调试安卓设备,包括模拟器,可以进入终端模式(安卓本身相当于一个linux) 1.配置adb环境变量 以夜神模拟器为例,将模拟器安装路径里的bi ...

  5. Spring Cloud微服务实践之路- Eureka Server 中的第一个异常

    EMERGENCY! EUREKA MAY BE INCORRECTLY CLAIMING INSTANCES ARE UP WHEN THEY'RE NOT. RENEWALS ARE LESSER ...

  6. Flask-Login用户登陆

    Flask-Login Flask-Login 提供用户会话管理,处理常见的登录.退出和注册的任务. Flask-Login 没有绑定数据库,可以从数据库回调用户对象. 安装flask-login p ...

  7. 动态渲染页面爬取-Selenium & Splash

    模拟浏览器的动机 JS动态渲染的页面不止Ajax一种 很多网页的Ajax接口含有加密参数,分析其规律的成本过高 通过对浏览器运行方式的模拟,我们将做到:可见即可爬 Python中常用的模拟浏览器运行的 ...

  8. “Excel-建议不可用于您所选择的数据”错误提示

    Excel作为一项的数据图表绘制软件,在工作中经常用到.“建议不可用于您所选择的数据这一错误提示,我也遇到了几次了,但是每次遇到总是忘了上次是什么原因.这次,写下博客记录.一般都是在复制网页或者其他数 ...

  9. patchwork.ffmpeg.org 里面未被选中的优秀代码

    很多程序员为 FFMpeg 增加新功能写出代码, 把写好的代码 git send-email 邮件方式提交 patch 文件 发送给 patchwork.ffmpeg.org; 一直认为 FFMpeg ...

  10. spring-mvc访问本地html文件

    项目中要用到在线预览word文档,刚开始考虑是要将word转成pdf文件,然后再直接在浏览器打开pdf文档即可, 但是项目部署在Linux下,在网上搜了一下没有找到合适的方法, 后来项目组讨论用POI ...