无法动态地向{％static“提供图像名称在AngularJS [英] Unable to provide image names dynamically to {% static " in AngularJS
问题描述
<div class="container" ng-repeat="item in itemslist">
<img ng-src="{% static "img/new/item.imagename" %}" alt="" />
</div>
项 - >是一个对象，下面是对象定义
item - > is an object, below is the object definition
var firstItem = {};
firstItem.id = 0;
firstItem.name = "testfirstname";
firstItem.imagename = "cart.png";
var secondItem = {};
secondItem.id = 2;
secondItem.name = "testsecondname";
secondItem.imagename = "home.png";
itemslist - > [firstitem，seconditem]
itemslist- > [firstitem, seconditem]
在运行时， item.imagename 不会被其值（cart.png）替换。从迭代出来。该请求仍然使用变量名（item.imagename）查找，而不是值（cart.png）。
In the runtime, item.imagename is not getting replaced by its value (cart.png). coming out of the iteration. The request still looks with the variable name (item.imagename) and not the value (cart.png).
找不到页面（404 ）
http://example.localhost.com:8000/ static / img / new / item.imagename
我该如何使这个工作？
推荐答案
页面呈现Django的顺序是：
The order in which a page renders with Django is:
-
请求是从客户机（浏览器）到服务器（最终Django）进行的。
A request is made from the client (browser) to the server (ultimately Django).
Django使用url匹配视图，该视图将在模板中呈现服务器。
Django matches a view using the url, and from the view renders the template in server.
客户端获取响应并呈现页面。在这个阶段，客户端对Django，其模板系统等都无所知。
The client gets the response and renders the page. At this stage, the client knows nothing about Django, its templating system etc.
Angular是一种运行的JS技术客户端。它绝对没有办法知道静态文件，Django模板等。
Angular is a JS technology that operates client-side. It has absolutely no way to know about static files, Django templates etc.
因此，如果您需要在客户端加载映像，则必须正确指定该网址前提。既然你知道这个名字，你只需要把其余的url提供给有角度的。
Therefore, if you require to load an image in client-side, then you have to properly specify the url beforehands. Since you know the name, you need only to provide the rest of the url to angular.
为了做到这一点，你需要包含设置。 STATIC_URL 到您的上下文，并将其渲染为模板中的js变量。该变量将传递到客户端，然后在角度使用它来正确构建URL。
To do that, you need to include settings.STATIC_URL to your context, and render it into a js variable in your template. This variable will travel through to client, and then in angular use it to properly build the url.
确实要考虑角度对插值的安全考虑，但这完全不同。
Be sure to take care of angular's security considerations about interpolation though, but that's a different matter entirely.
开始Web开发时，服务器端客户端混淆是一种常见问题。
The server-client confusion is a common one when beginning web development.
这篇关于无法动态地向{％static“提供图像名称在AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
