ngHref

在Angular程序没完成改变链接上用{{hash}}方式绑定的href值的时候,当用户点击该链接会跳到一个错误的页面。

格式:ng-href=”value”

value:表达式。

使用代码:

  <a ng-href="http://www.xxxxx.com">点击进入xxxxx网站</a>

如果href绑定的url是动态绑定(从就是代码中绑定到view),使用的是href,那么就会出现href 绑定出现错误,因为angular还未对html上的表达式进行编译,原先就用href绑定的值最后还是href="{{hash}}" ,而如果用ng-href,那么angular将会在编译完后去绑定url,当然这时候你看到的a标签属性上同时存在ng-href和href,后面的 href是解析出来的,并且2个属性上的url值都正确绑定。

ngSrc

在Angular里面,src标签上使用 {{hash}} 标记是错误的。在Angular替换{{hash}}内的表达式之前,浏览器将会使用包括 {{hash}}文本的url。ngSrc解决了这个问题。

错误的使用方式:

<img src="http://www.gravatar.com/avatar/{{hash}}"/>

正确的使用方式:

  <img ng-src="http://www.gravatar.com/avatar/{{hash}}"/>

ngSrc与ngHref同理。

ngCopy/ngCut/ngPaste

  <input ng-copy="copy=true" ng-init="copy=false; value='copy me'" ng-model="value">{{copy}}
<input ng-cut="cut=true" ng-init="cut=false; value='cut me'" ng-model="value">{{cut}}
<input ng-paste="paste=true" ng-init="paste=false" placeholder='paste here'>{{paste}}

通过上面三个指令分别在触发复制/剪切/粘帖时我们可以执行我们自定义的事件了

Angular - - ngHref、ngSrc、ngCopy/ngCut/ngPaste的更多相关文章

  1. AngularJs ngHref、ngSrc、ngCopy/ngCut/ngPaste

    ngHref 在Angular程序没完成改变链接上用{{hash}}方式绑定的href值的时候,当用户点击该链接会跳到一个错误的页面. 格式:ng-href=”value” value:表达式. 使用 ...

  2. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  3. 前端开发环境搭建 Grunt Bower、Requirejs 、 Angular

    现在web开发的趋势是前后端分离.前端采用某些js框架,后端采用某些语言提供restful API,两者以json格式进行数据交互. 如果后端采用node.js,则前后端可以使用同一种语言,共享某些可 ...

  4. 【JavsScript】JavaScript MVC框架PK:Angular、Backbone、CanJS与Ember

    摘要:选择JavaScript MVC框架很难.一方面要考虑的因素非常多,另一方面这种框架也非常多,而要从中选择一个合适的,还真得费一番心思.本文对JavaScript MVC框架Angular.Ba ...

  5. JavaScript MVC框架PK:Angular、Backbone、CanJS与Ember

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  6. Angular - - ngCloak、ngController、ngInit、ngModel

    ngCloak ngCloak指令是为了防止Angular应用在启动加载的时候html模板将会被短暂性的展示.这个指令可以用来避免由HTML模板显示造成不良的闪烁效果. 格式: ng-cloak   ...

  7. angular之$watch、$watchGroup、$watchCollection

    1,原型:$watch: function(watchExp, listener, objectEquality, prettyPrintExpression){}: 2,参数:watchExp(必须 ...

  8. angular4.0 安装最新版本的nodejs、npm、@angular/cli的方法

    在使用ng项目的ui框架时,比如ng-zorro.angular Material,需要安装最新版本的@angular/cli: 配置ng-zorro框架 ng-zorro官网:https://ng. ...

  9. 前端框架Angular、react、vue在github上的数据统计-2018-05

    2018年5月31日09:15:45 突然想看看几个前端框架的数量,然后就截图了如下数据: 分析: react关注.收藏.Fork都高vue一些, 但相差不大 angular比较奇葩,收藏只有二者一半 ...

随机推荐

  1. 用JavaScript 来将数字转换成字符。

    背景: 一切嵌入式设备上面的信息,比如设备名称,设备时区是可以写入到设备上面的寄存器中的(一个寄存器两个字节,2*8 bit),比如 -1 ,写入到寄存器中为 2d31,然后可以通过一些进程将寄存器中 ...

  2. js变量数组

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  3. aspx 文件上传和下载,多文件上传

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="MultiFileUpload. ...

  4. hrbustoj 1125 循环小数 II(小数变分数+极限思想)

    #include<stdio.h> #include<string.h> #include<algorithm> #include<math.h> #i ...

  5. DRAM Memory Rank知识

    DRAM的一些知识点,先记录下来再进行整理 1.何为Memory rank? A memory rank is a set of DRAM chips connected to the same ch ...

  6. Employment Planning DP

    Employment Planning Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Othe ...

  7. hibernate--联合主键--XML

    xml:composite-id 要重写equals,hashCode方法, 还要序列化 1. 新建一个主键类: StudentPK.java, 注意需要序列化.还要重写equals和hashCode ...

  8. Quick Cocos2dx 调试问题

    最近由于忙了一段时间,忙完了之后又迷茫了这么久,然后终于开始继续Quick-x的学习之路了. 然后遇到了一个比较棘手的问题. 虽然照着官方mvc的例子敲代码,但是还是不停的报错,报错的问题下次集结成一 ...

  9. Quick Cocos2dx 与 Eclipse 连真机debug遇到的问题

    今天下午解决了因为偷懒一直忍受的两个让我不爽很久了的问题: 1Eclipse无法连接手机调试的问题. 在设备管理器中看到的Android设备有黄色的感叹号, 说明驱动不是最新的. 按照网上搜到的解决方 ...

  10. (简单) LightOJ 1074 Extended Traffic,SPFA+负环。

    Description Dhaka city is getting crowded and noisy day by day. Certain roads always remain blocked ...