En mis plantillas estoy haciendo algo comomanillares de plantillas e imágenes dinámicas
<img class="someClass" src="{{imgURL}}">
Las imágenes se cargan correctamente, pero me sale advertencias como:
GET http://localhost:8888/%7B%imgURL%7D%7D 404 (Not Found)
¿Hay una manera de solucionar este problema?
usted tiene dos problemas:
<img> pero eso no es un gran problema.<div> o similar que contiene HTML.Si dice esto:
<div id="t" style="display: none">
<img class="someClass" src="{{imgURL}}">
</div>
el navegador interpretará el <img> como una imagen real y tratar de cargar el recurso especificado en el atributo src, que es donde el 404:
GET http://localhost:8888/%7B%imgURL%7D%7D 404 (Not Found)
viene de. Las plantillas raramente son válidas y están formadas de manera adecuada por lo que debe evitar que el navegador intente interpretar la plantilla como HTML. El enfoque habitual es almacenar la plantilla en un <script> con un no-HTML type:
<script id="t" type="text/x-handlebars-template">
<img class="someClass" src="{{imgURL}}">
</script>
entonces se puede decir Handlebars.compile($('#t').html()) para obtener su plantilla compilada y el navegador no va a tratar de interpretar el contenido #t como HTML.
Gracias, esto solucionó mi advertencia. – swallace
Sé que es tarde, pero aquí es cómo hacer lo que quiere:
var view = Ember.View.create({templateName: 'myTemplate', myPicture: 'http://url_of_my_picture.png'});
view.appendTo('#myDiv');
<script type="text/x-handlebars" data-template-name="myTemplate">
<img {{bindAttr src="myPicture"}}>
</script>
He encontrado que el uso de soportes triples no tendrán ningún problema.
<img src="{{{your source}}}" alt={{{your alt}}} />
La pregunta fue hecha en 2012, hace más de 5 años. ¿Estás seguro de que esta nueva respuesta es aplicable a la versión 2012 de handebars.js? – sisve
¿Está la plantilla anexada a la página antes de ser analizada por su motor de plantillas? Si es así, no veo ninguna solución. –
No lo creo. Estoy haciendo una llamada ajax que agarra las plantillas de mi manillar externo. Guardo en caché esas plantillas y luego tengo una función que toma los datos json y encuentra la plantilla adecuada para usar como fuente y luego compilo la fuente y paso los datos json a esa plantilla compilada. ¿Hay algo acerca de este método que pueda causar estas advertencias? – swallace
Eso es raro entonces. Bueno, cuando creas un elemento de imagen con la fuente, el navegador solicitará tratar de almacenarlo en la memoria caché. Si la plantilla se analiza como una cadena, se analiza en elementos DOM que no deberían suceder. Pero, de todos modos, puede ignorar ese tipo de advertencia, solo para informarle que no se encontró un archivo solicitado (eso es justo antes de cambiar la fuente y volver a cargar), los usuarios finales regulares no tienen sus consolas abiertas mientras navegan Tú sitio. '=]' –