angularjs – 为什么{{}}不能在src属性中工作?为什么我需要ngSrc?

前端之家收集整理的这篇文章主要介绍了angularjs – 为什么{{}}不能在src属性中工作?为什么我需要ngSrc?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这有效:
<a href="{{myAwesomeLink}}">It's a link. A dynamic one,at that.</a>

但这不是:

<img src="{{URLtoMyPerfectImage}}">

一个人需要使用ngSrc.我可以知道为什么会这样吗?我有一个类似的问题得到’src'(或者是’href’?我不记得了)在Handlebars.js工作并放弃它(交付的压力).

这是一个普遍的浏览器问题或类似的东西?

同时将答案扩展到我之上
<a href="{{myAwesomeLink}}">It's a link. A dynamic one,at that.</a>

当使用Angular动态创建链接时,这不是最佳实践.只要在锚标记中使用数据绑定,就应该使用ng-href指令.所以锚标记代码应如下所示:

<a ng-href="{{myAwesomeLink}}">It's a link. A dynamic one,at that.</a>

直接来自Angular的文档:

Using Angular markup like in an href attribute makes the page open to a wrong URL,if the user clicks that link before angular has a chance to replace the with actual URL,the link will be broken and will most likely return a 404 error. The ngHref directive solves this problem.

这有助于我们理解ng-src:所以用

<img src="{{imgPath}}">

浏览器尝试加载图像,但Angular尚未替换src中的括号表达式,因此图像无法加载.通过使用

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

您告诉浏览器等待加载图像,直到填充了括号内的表达式,从而加载正确的图像.

原文链接:https://www.f2er.com/angularjs/140903.html

猜你在找的Angularjs相关文章