AngularJS 设置img (ng-src 和 src 区别)

发布时间：2020-12-17 10:28:18 所属栏目：安全来源：网络整理

导读：AngularJS 使用 ng-src 替换了 src : img ng-src = " {{ imageUrl }} " 错误写法: img src = "http://www.coderlady.com/avatar/ {{ hash }} " / 正确写法 img ng-src = "http://www.coderlady.com/avatar/ {{ hash }} " / 这是因为在加载页面的时候,在Angul

AngularJS 使用 ng-src 替换了src :

<img ng-src="{{imageUrl}}">

错误写法:

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

正确写法

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

这是因为在加载页面的时候,在Angular加载完成之前,浏览器会试图从http://www.coderlady.com/avatar/{{hash}} 加载图片,当然这会失败.一旦Angular加载完成以后,浏览器就会明白{{hash}}变量需要被具体值代替,比如logo.png.然后就会到正确的http://www.coderlady.com/avatar/logo.png 去加载图片. 这显然就要执行两次操作.
ng-src就解决了这个问题,因为它会等Angular加载完成以后,才会到正确的地址去加载数据.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!