Django：将HTML字符串传递给模板 [英] Django: Passing HTML string to template

问题描述

我在尝试显示在django视图上创建的html代码块时遇到问题。
这就是发生了什么。

在我看来，我试图传递给模板一堆书描述，我将根据用户操作。这些描述存储在服务器上的HTML文件中。

  def my_view（）
 #loop通过书籍列表，阅读它们相应的一个html文件，并解析它以填写书籍的详细信息
 #code，code，code ... 
＃获取结果字符串，将它附加到书籍描述数组中，记录它和将其发送到模板
 logger.debug（books_description [Clockwork orange]）
 return render_to_response（my_template.html，{'bd'：books_description}，context_thingy）
  

到目前为止这么好。我的日志完全按照它应该显示的html字符串：

 < div id =modal_book_name> Clockwork orange< / div> ; 
< div id =modal_book_genre> Dystopian fiction< / div> 
< br> 
< div id =modal_book_desc> yadayadayadayada< / div> 
  

现在，由于我不希望内容放在我的html代码上，因此我阅读了书籍描述到像这样的JavaScript变量：

  books_description = {}; 
 {％为book，book_desc为bd.items％} 
 books_description [{{book}}] ={{book_desc | escapenewline}}
 {％endfor％} 
  

escapenewline是一个过滤器，它将\放在每行的末尾，以确保javascript是能够正确地解释整个字符串内容。

最后，当用户想要查看某本书的描述时，他只需点击它，模式就会显示出来描述。为此我有：

  console.log（books_description [book_name]）; 
 $（＃modal_info）。html（books_description [book_name]）; 
  

再次，这个console.log显示一切正常：

 < div id =modal_book_name> Clockwork orange< / div>< div id =modal_book_genre> Dystopian fiction< / div>< br> < div id =modal_book_desc> yadayadayadayada< / div> 
  

不幸的是，当我打开页面时，modal_info div是空的。当我打开浏览器的开发人员工具并检查该div的html时，我看到：

 < div id =modal_info > 
< div id =modal_book_name> Clockwork orange< / div>< div id =modal_book_genre> dystopian fiction< / div>< div>< div id =modal_book_desc>> ; yadayadayadayada< / DIV>中
< / div> 
  

问题出在这些引号中。他们是如何出现在那里的？我怎么能摆脱他们，为什么他们放在那里呢？

先谢谢了。如果有什么不清楚的地方，请随时询问，我会澄清它。

更新 ：出来的modal_info股利是不是空的毕竟..文本只是背景相同的颜色。道歉，这是我的愚蠢。但问题依然存在。在哪里我应该看到：

  Clockwork Orange 
 Dystopian fiction 
 
 yadayadayadayada 
  

我看到的是字面html：

 
> Clockwork orange< / div>< div id =modal_book_genre> dystopian fiction< / div>< br>< div id =modal_book_desc > yadayadayadayada< / DIV> 
  

我试图用parseHTML函数将字符串解析为HTML：

  var book_desc = $ .parseHTML（books_description [book_name]）; 
 $（＃modal_info）。html（book_desc）; 
  

但结果相同。任何想法如何让浏览器将字符串解释为html代码而不是字符串

解决方案

解决方案

没有我想象的那么戏剧化。恰巧，django正在将HTML标记（如'<'和'>'）转换为'& lt'和'& gt'。

正确的页面输出，但无法创建相应的DOM对象。

修正：

  {％autoescape off％} 
 {％book，book_desc in bd.items％} 
 books_description [{{book}}] ={{book_desc | escapenewline }}
 {％endfor％} 
 {％endautoescape％} 
  

花了我一会儿。
如果有人遇到类似的问题，这里有一些关于自动转义的英文版本。

autoescape过滤器

I'm having an issue while trying to display a html chunk of code created on a django view. Here's what's happening.

On my view, I'm trying to pass to the template a bunch of book descriptions which I'll hide/show according to user action. These descriptions are stored in html files on the server.

def my_view()
     #loop through the list of books, read their corresponding a html file, and parse it to fill in the book details
     #code, code, code...
     #take the resulting string, append it on books description array, log it and send it to template
     logger.debug(books_description["Clockwork orange"])
     return render_to_response("my_template.html", {'bd': books_description}, context_thingy)

So far so good. My logs show the html string exactly as it should:

 <div id="modal_book_name">Clockwork orange</div>
 <div id="modal_book_genre">Dystopian fiction</div>
 <br>
 <div id="modal_book_desc">yadayadayadayada</div>

Now, since I do not want the content laying about on my html code, I read the book descriptions into a javascript variable like so:

 books_description = {};
 {% for book, book_desc in bd.items %}
       books_description["{{ book }}"] = "{{ book_desc|escapenewline }}"
 {% endfor %}

The escapenewline is a filter that puts a \ at the end of every line, to ensure that javascript is able to correctly interpret the whole string content.

Finally, when the user wants to check out the description on some book, he just clicks it and modal shows up with the book description. for this I have:

    console.log(books_description[book_name]);
    $("#modal_info").html(books_description[book_name]);

Again, everything seems fine with this console.log:

<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>

Unfortunately, when I open the page the modal_info div is empty. When I open the browser's developer tools and check the html of that div here's what I see:

 <div id="modal_info">
      "<div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>"
 </div>

The problem is in those quotation marks. How did they show up there? How can I get rid of them and why were they put there in the first place?

Thanks in advance. If anything was unclear, feel free to ask and I'll clarify it.

UPDATE: Well, turns out that the modal_info div was not empty after all.. the text was only the same color as the background. Apologies, that was stupid of me. But the problem persists. Where I should see:

 Clockwork Orange
 Dystopian fiction

 yadayadayadayada

I see instead the literal html:

 <div id="modal_book_name">Clockwork orange</div><div id="modal_book_genre">Dystopian fiction</div><br><div id="modal_book_desc">yadayadayadayada</div>

I've tried to parse the string to HTML with the parseHTML function:

  var book_desc = $.parseHTML(books_description[book_name]);
  $("#modal_info").html(book_desc);

but results are the same. Any idea how to get the browser to interpret the string as html code and not as a literal string

解决方案

Problem solved. Wasn't as dramatic as I thought. It so happens that django was converting html tokens such as '<' and '>' to '&lt' and '&gt'

This resulted in a correct output on the page, but inability to create the corresponding DOM objects.

the fix:

 {% autoescape off %}
    {% for book, book_desc in bd.items %}
       books_description["{{ book }}"] = "{{ book_desc|escapenewline }}"
    {% endfor %}
 {% endautoescape %}

Took me a while. If anyone comes across a similar issue here's some intel on autoescaping

autoescape filter

这篇关于Django：将HTML字符串传递给模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！