AngularJS1.x 事件指令

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_43995925/article/details/96861584

AngularJS:事件指令

事件指令:

  1. ng-click / ng-dblclick      单击 / 双击;
  2. ng-mousedown / up              鼠标按下 / 抬起;
  3. ng-mousemove / over / out         鼠标移动 / 移入 / 移出 ;
  4. ng-keydown / up / press              键盘按下 / 抬起 / 按住 ;
  5. ng-focus / blur          获得光标 / 失去光标 ;
  6. ng-submit          提交 ;
  7. ng-selected        下拉菜单默认被选择(与之前相比,可以加变量或者函数) ;
  8. ng-change          内容改变事件经常结合ng-model指令使用 ;

 

AngularJS:input指令

input指令:

  1. ng-disabled        按钮是否禁用(结合 $interval服务使用) ;
  2. ng-readonly              输入框是否为只读模式 ;
  3. ng-checked        复选框是否被选中 ;
  4. ng-value             表单的值 ;

 

AngularJS:CSS样式相关的指令和DOM操作相关的指令

CSS样式相关的指令:

  1. ng-cloak      不常用 控制css显示和隐藏 display:none ;
  2. ng-class              增加class属性 格式:ng-class= “{class名:true}”或false ;
  3. ng-style              设置样式,格式: ng-style= “{{变量名}}”变量内容写json格式{color: ‘red’, background: ‘red’} ;
  4. ng-href        设置超链接 格式:ng-href= “{{变量名}}”;
  5. ng-src          设置图片src属性 格式:ng-src= “{{变量名}}”;
  6. ng-attr-(suffix)   设置属性 格式:ng-attr-title=“{{变量名}}” / ng-attr-width=“{{变量名}}” / ...  (suffix)属性名;

 

DOM操作相关的指令:

  1. ng-show      控制显示隐藏 返回布尔值 ;
  2. ng-hide        控制显示隐藏 返回布尔值 ;
  3. ng-if             DOM节点的添加删除操作 返回布尔值 true表示创建节点 / false 表示删除节点;
  4. ng-switch    不常用:返回布尔值 true 显示 / false 隐藏 ;
  5. ng-open      不常用 兼容性不好: html5 open 属性返回true展开 / false 折叠;

 

 

 

展开阅读全文

没有更多推荐了,返回首页