Angular指令学习-简单介绍
Angular指令学习-简单介绍
1.ng-app
ng-app指令是用来告诉应用程序当前元素是根元素；所有的Angular应用程序都必须要有一个根元素；一个html文档中只能有一个ng-app指令，如果出现多个ng-app指令，应用程序只会执行第一个，若想让除了第一个以外的ng-app也执行，请看本人博客中“AngularJs一个页面多个ng-app的问题"。
2.ng-bind
把元素和应用程序绑定
ng-bind和{{ }}加载的区别：
{{ }}是在页面加载完之后才会取数据值， ng-bind也是在页面加载完之后取值
不同的是如果页面加载的比较慢，{{ name }}加载的数据还没有出来，用户就可以看到模板渲染的结构，而ng-bind="name"就不会出现这样的问题，所以建议使用ng-bind。
3.ng-bind-html
以一种安全的方式把元素绑定到应用程序
4.ng-bind-template
将指定表达式的值替换成html元素的值，ng-bind-template的值可以用一个或者多个{{}}表示（多个之间以空格隔开）
ng-init:初始化数据
ng-model:将元素绑定到应用上
5.ng-blur（相当于onblur）
输入框失去焦点时执行的表达式：
{{ count }}
, ,
15.ng-hide:显示或隐藏元素
隐藏html：Welcome
Welcome to my home.
ng-if:表达式为 false 时移除 HTML 元素，表达式为true时添加元素
保留html：Welcome
Welcome to my home.
ng-show:在表达式为 true 时显示指定的 HTML 元素，否则隐藏指定的 HTML 元素
显示html: Welcome
Welcome to my home.
区别：ng-if 指令不同于 ng-hide， ng-hide 隐藏元素，而ng-if 是从 DOM 中移除元素
16.ng-href:为元素指定链接
访问{{ myVar }}学习！！
17.ng-include:包含文件
18.ng-keydown
按下按键时执行，第{{count}}次
ng-keypress
按下按键时执行，第{{count}}次
ng-keyup
body ng-app="">按下按键时执行，第{{count}}次
均为按下按键时执行的动作，按键敲击的执行顺序如上顺序从上到下
19.ng-list:将字符串转为数组，字符转之间并用逗号隔开
在文本框中输入值并用逗号隔开
{{ customers }}
20.ng-model-options:绑定表单元素到scope变量中
{{ name }}
ng-model-options的值如下：
21.ng-mousedown
点击鼠标点击后执行的动作，第{{ count }}次
ng-mouseup
点击鼠标点击后执行的动作，第{{ count }}次
ng-click
点击鼠标点击后执行的动作，第{{ count }}次
均为鼠标在指定的元素上按下时候要执行的操作，执行顺序按上面顺序从上到下
ng-mouseenter：鼠标指针穿过元素时执行的动作
点击鼠标指针穿过元素时执行的动作，第{{ count }}次
ng-mouseleave：鼠标指针离开元素时执行的动作
点击鼠标指针离开元素时执行的动作，第{{ count }}次
ng-mousemove：鼠标指针在指定的元素中移动时执行的动作
点击鼠标指针在指定的元素中移动执行的动作，第{{ count }}次
ng-mouseover：鼠标指针在元素上方时执行的动作
点击鼠标指针在元素上方时执行的动作，第{{ count }}次
ng-mouseup：松开元素上的鼠标按钮时执行的动作
点击松开鼠标按钮在元素上时执行的动作，第{{ count }}次
22. ng-non-bindable：指定元素或子元素不能绑定数据
此元素不需要使用Angular{{ 5+5 }}
23.ng-open：设置details列表的open属性
点击显示details列表：
技术、梦想
学习网址
24.ng-options：在
select下拉框中选中的值为：{{ selectName }}
25.ng-paste：粘贴文本
粘贴文本到文本框中次数，第{{ count }}次
26.ng-readonly：指定元素的可读属性，如果 ng-readonly 属性的表达式返回 true 则表单域为只读
指定元素的readonly属性：
该文本框可读：
该文本框可写：
27.ng-reapt：定义集合中每项数据的模板
{{ x }}
28.ng-selected：设置元素的默认选中属性
点击复选框并选中绑定的值：我喜欢：
29.ng-src：覆盖了 ![]()
元素的 src 属性，确保的 AngularJS 代码执行前不显示图片
![]()
ng-srcset：
![]()
30.ng-style：指定元素的样式，
ng-style 属性值必须是对象，表达式返回的也是对象；对象由 CSS 属性和值组成，即 key=>value 对
welcome
31.ng-submit：onsubmit时间发生后执行的动作
{{ myText }}
32.ng-switch：显示或隐藏子元素的条件
选择网址：
百度
欢迎访问百度
谷歌
欢迎访问谷歌
博客
欢迎访问博客
切换网址
根据不同的选项显示不同的值
33.ng-value：规定input元素的值
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！
