Question

我想在Angular中格式化XML文件。我尝试过：

<div class="element-box">
  <div class="details-wrapper">
    <p><b class="label">Raw Request</b>
      <pre>
        {{apiattempt.raw_request | xmlBeautyfier }}
      </pre>
    </p>
  </div>
</div>

但是我得到这个错误：

ERROR in : Template parse errors:
Unexpected closing tag "p". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("
        {{apiattempt.raw_request | xmlBeautyfier }}
      </pre>
    [ERROR ->]</p>
    <p><b class="label">Raw Response</b>{{apiattempt.raw_response | xmlBeautyfier }}</p>
  </div"):

您知道我该如何解决吗？

Answer 1

<pre>标签是块级元素。将其放置在...内时，它将像一样导致其关闭并在到达时引发错误。在您的之前关闭<pre>或将pre包装在另一个元素中（如果需要）。

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p

Answer 2

来自html.com：

标记是可选的，由标记之后的HTML文档中遇到的下一个HTML元素的开幕标记暗含。

Answer 3

引用：https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags

在HTML中：p标签被下一个元素隐式关闭。所以

第一个p标签以p开头，以b或pre标签结束。（它是隐式关闭的）。
然后，解析器将找到/ p结束标记，而该标记没有看到前面的p标记。（第一个隐式关闭）。

解决方案（从最好的到最差的）：

当您做更多棘手的事情时，请不要使用p。您具有前置标记，因此您应考虑使用div或span更改原始p
OR drop / p（好主意）
或在/ p前面添加p。（在那里/ p ..是个坏主意）

可能的解决方案： -XHTML需要显式的关闭p标签。您可以尝试使用XHTML，并让我们知道它是否有效。注意：这对您的问题有些大材小用……学习总是不错；-）

希望这会有所帮助

模板解析错误：意外的结束标记“ p”

3 个答案: