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}}

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

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

  1. Angular - - ngHref、ngSrc、ngCopy/ngCut/ngPaste

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

  2. 前端MVC学习总结(二)——AngularJS验证、过滤器、指令

    一.验证 angularJS中提供了许多的验证指令,可以轻松的实现验证,只需要在表单元素上添加相应的ng属性,常见的如下所示: <input Type="text" ng-m ...

  3. 前端MVC学习笔记(二)——AngularJS验证、过滤器、指令

    一.验证 angularJS中提供了许多的验证指令,可以轻松的实现验证,只需要在表单元素上添加相应的ng属性,常见的如下所示: <input Type="text" ng-m ...

  4. AngularJs:Service、Factory、Provider依赖注入使用与区别

           本教程使用AngularJS版本:1.5.3        AngularJs GitHub: https://github.com/angular/angular.js/       ...

  5. AngularJS 简介、指令、表达式

    AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过指令扩展了 HTML,且通过表达式绑定数据到 HT ...

  6. AngularJS:何时应该使用Directive、Controller、Service?【新手必看】

    (这篇文章你们一定要看,尤其初学的人,好吗亲?) 大漠穷秋 译 AngularJS是一款非常强大的前端MVC框架.同时,它也引入了相当多的概念,这些概念我们可能不是太熟悉.(译者注:老外真谦虚,我大天 ...

  7. AngularJs学习笔记2-控制器、数据绑定、作用域

    上次分享完该系列文章后有朋友也建议说1.x版本除了维护也没有必要学习,可以学习2.0开始学习,我也知道1.x无论是从性能还是架构上都没有2.x好,但是我想因为现在也有一些朋友还在用1.x版本,因为1. ...

  8. AngularJS:何时应该使用Directive、Controller、Service?

    AngularJS:何时应该使用Directive.Controller.Service? (这篇文章你们一定要看,尤其初学的人,好吗亲?) 大漠穷秋 译 AngularJS是一款非常强大的前端MVC ...

  9. AngularJS 1.x系列:AngularJS服务-Service、Factory、Provider、Value及Constant(5)

    1. AngularJS服务 AngularJS可注入类型包括:Service.Factory.Provider.Value及Constant. 2. Service AngularJS Servic ...

随机推荐

  1. 我和Lua并非一见钟情,我们期待着日久生情(相遇篇)

    Lua作为一款轻量级的脚本语言,由标准C编写而成,可被C/C++调用,也可调用C/C++的函数. 在目前的脚本引擎中,Lua的速度是最快的... Lua可直接在EditPlus文本处理器上开发,只需搭 ...

  2. 实用工具 : Xaml Power Toys

    最近挺忙, 憋了一肚子的东西没有分享. 今天分享一个 Xamarin.Forms / WPF 的增强工具 , Visual Studio 扩展 : Xaml Power Toy 可以直接在 VS201 ...

  3. android之远程启动服务

    启动远程服务和隐式启动Activity一样 实现一个服务 为了演示方便,该服务是一个空服务 package xidian.dy.com.chujia; import android.app.Servi ...

  4. 删除root子目录,如何恢复子目录配置文件

    手贱,一不小心rm -rf 问题描述:删除/root/子目录文件(含隐藏配置文件)shell变成-bash-4.2#,如何恢复原貌 解决方法: root用户进入,自己配置相关文件:mkdir /roo ...

  5. plsql解决中文乱码以及问号问题

    PLSQL执行sql语句,不识别中文,输出的中文标题显示成问号???? 输入sql语句select * from V$NLS_PARAMETERS查看字符集,查看第一行value值是否为简体中文 设置 ...

  6. Mybatis 异常: The content of elements must consist of well-formed character data or markup

    原因很简单:在ibatis的配置文件中不能出现小于号(>)     <delete id="deleteByPrimaryKey" parameterType=&quo ...

  7. Jquery-获取iframe中的dom对象

    父窗口中操作iframe: $(window.frames["iframeChild"].document) //假如iframe的id为iframeChild 在子窗口中操作父窗 ...

  8. 【HDU 2063】过山车(二分图匹配)

    n个女生,m个男生.如果女生i愿意让男生j作为parner,那就建边i->j+n,和j+n->i.然后用匈牙利算法算出最大匹配. 要注意N和M都要开2倍. #include <cst ...

  9. 【POJ 3062】Party(2-SAT、tarjan)

    2-SAT的入门题. a,a',b,b'分别表示两对夫妇,如果a,b有矛盾,那么a要来,就只能来b',b要来,就只能来a'.于是建了两条边(a,b'),(b,a'). 用tarjan强连通分量缩点染色 ...

  10. 简进祥===AFNetWorking 下载视频文件

    获取沙盒中的Documents地址的代码. NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUs ...