您的位置:首页 > Web前端 > AngularJS

angular常用内置指令

2017-10-24 15:58 369 查看
4000

angular常用指令

指令名称描述
ng-app用来定义模块的作用范围
ng-controller用来定义控制器的作用范围
ng-repeat循环遍历数组
ng-bind绑定数据 同{{}}
ng-show用来显示或隐藏元素 值为true / false ,原理是设置元素的display
ng-hide用来显示或隐藏元素 值为true / false 用法和ng-show相反,原理设置元素的display
ng-if用来显示或隐藏元素 和ng-show/ng-hide的不同点是它直接删除元素
ng-cloak用来解决“闪烁”的问题,原理是在angular还未执行的时候先让元素display:none
ng-class用来控制类名,使用方式:ng-class="{class:true/false}" class对应的值只要转为布尔值为true就是显示
ng-include用来引用外部的模板文件
ng-disabled用来控制表单是否禁用,值为true/false
ng-src用来引用图片的路径 可以解决"闪烁"问题
ng-href用来引用a链接的路径 可以解决"闪烁"问题
ng-readyonly用来控制表单是否只读,值为true/false
ng-checked用来控制复选框选中,值为true/false
ng-selsected用来控制下拉框选中,值为true/false
ng-init初始化模型,就是$scope
ng-switch on对数据进行筛选 值为$scope的属性
ng-switch-when对数据进行筛选 值为$scope的属性值
ng-bind-templete绑定多个数据 ng-bind-template="{{data1}}{{data2}}"

angular事件指令

事件指令描述
ng-click单击事件
ng-dblclick双击事件
ng-focus获得焦点事件
ng-blur失去焦点事件
ng-mouseout鼠标离开事件
ng-mouseover鼠标经过事件
ng-submit表单提交事件
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: