AngularJs ngHref、ngSrc、ngCopy/ngCut/ngPaste

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

最新文章

热门文章