为什么不{{}}在SRC属性的工作？为什么我需要ngSrc？ [英] Why doesn't {{}} work in src attributes? Why do I need ngSrc?

问题描述

本作品：

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

但是，这并不：

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

一个需要使用 ngSrc 来代替。我想知道为什么是这样的呢？我有一个类似的问题，得到一个SRC（或者是它的href'？我不记得了）在Handlebars.js工作，放弃了它（pressure交付）。

One needs to use ngSrc instead. May I know why this is the case? I had a similar problem getting a 'src' (or was it 'href'? I don't remember) to work in Handlebars.js and gave up on it (pressure for delivery).

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

Is this a pervasive browser issue or something similar?

推荐答案

扩展我上面的答案，而

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

工作，它是不是在使用角度动态创建的链接最佳实践。您使用的数据在一个锚定标记绑定任何时候，你应该使用NG-HREF指令。因此，code为锚标记应该是这样的：

works, it is not the best practice when dynamically creating links using Angular. Any time you use data binding in an anchor tag you should use the ng-href directive. So the code for the anchor tag should look like:

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

从直角的文档：

采用了棱角分明的标记就像href属性使得页面打开一个错误的URL，如果用户点击该链接角前有机会与实际的URL来代替，该链接将被打破，将最有可能返回404错误。所述ngHref指令解决了这个问题。

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：因此，与

This helps us understand ng-src: So with

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

浏览器尝试加载图像，但角度还没有更换SRC中括号内的前pression，因此图像加载失败。通过使用

The browser tries to load the image, but Angular has not yet replaced the bracketed expression within the src, so the image fails to load. By using

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

您告诉浏览器等待加载图像，直到括号内的前pression已填写，从而加载正确的图像。

you are telling the browser to wait to load the image until the bracketed expression has been filled in, thus loading the correct image.

这篇关于为什么不{{}}在SRC属性的工作？为什么我需要ngSrc？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！