Javascript ember.js html输出已中断

我在调试以下失败原因时遇到了很多麻烦：

给定以下模板：

<p class='navbar-text pull-right header-user-info'>
{{#if currentUser.isSignedIn}}
  {{#if view.isDashboard}}
    <img {{bindAttr src="currentUser.avatar" title="currentUser.fullName"}} class='avatar'>
  {{else}}
    {{view PR2.NavigationSelectMenuView selectedBinding="view.selected"}}
    {{navigationIcon selectedBinding="view.selected"}}
  {{/if}}
  <span class='user-info'>
    aangemeld als {{currentUser.fullName}}
    {{#link-to 'session.destroy'}}log uit{{/link-to}}
  </span>
{{/if}}
</p>

当我转到仪表板（view.isDashboard为true）时，图像将被渲染，而else则不会像应该的那样被渲染。如果然后导航到应用程序的另一部分，isDashboard将变为false，navigationIcon和navigationSelectMenu将在p-tag中按应有的方式呈现。到目前为止一切都很好

当我直接从另一个路径输入应用程序并跳过仪表板（例如，我转到/settings）时，就会出现问题。isDashboard为false，将渲染2个视图。但是html输出被破坏了：

HTML输出在仪表板中导航时（良好的输出），所有变形标记都正确嵌套：

<p class="navbar-text pull-right header-user-info">
  <script id="metamorph-0-start" type="text/x-placeholder"></script>
  <script id="metamorph-1-start" type="text/x-placeholder"></script><script id="metamorph-1-start" type="text/x-placeholder"></script>
  <ul id="ember511" class="ember-view"></ul>
  <span id="ember514" class="ember-view avatar settings-icon"></span>
  <script id="metamorph-1-end" type="text/x-placeholder"></script>
  <span class="user-info">
    <span id="i18n-0">aangemeld als</span> <script id="metamorph-2-start" type="text/x-placeholder"></script>username<script id="metamorph-2-end" type="text/x-placeholder"></script>
    <a id="ember424" class="ember-view loading" href="#"><span id="i18n-1">log uit</span></a>
  </span>
  <script id="metamorph-0-end" type="text/x-placeholder"></script>
</p>

---

一切正常

问题显然是因为

p

（段落）标记不支持内部嵌套的

脚本

标记

摘自：

如果p元素后面紧跟着地址、文章、旁白、块引号、目录、div、dl、字段集、页脚、表单、h1、h2、h3、h4、h5、h6、页眉、hr、菜单、导航、ol、p、pre、section、table或ul元素，则可以省略p元素的结束标记，或者如果父元素中没有更多内容，并且父元素不是元素

这也是使用

div

时一切正常的原因。这不是一个余烬问题，而是与

p

标签的限制有关

因此，方法是将内容包装在

div

中，并按照处理段落的方式进行格式化

---

希望有帮助。

通过删除代码进行一些调试后，我发现只有当根标记是段落时才会发生这种情况，如果我将其更改为html，则不能将块元素放在内联元素中。您将遇到一些布局问题。看一看@直觉像素答案和这个相关的问题，这是不正确的措辞 带有嵌套脚本标记的标记似乎工作正常。但是，在第一次遇到引号中粗体的元素时，标记将自动关闭。在Rooding的情况下，元素是

元素。最后，我们有一个挂起的
标签，浏览器通过将其替换为
来修复该标签。

<p class="navbar-text pull-right header-user-info">
  <script id="metamorph-0-start" type="text/x-placeholder"></script>
  <script id="metamorph-1-start" type="text/x-placeholder"></script><script id="metamorph-1-start" type="text/x-placeholder"></script>
  <ul id="ember511" class="ember-view"></ul>
  <span id="ember514" class="ember-view avatar settings-icon"></span>
  <script id="metamorph-1-end" type="text/x-placeholder"></script>
  <span class="user-info">
    <span id="i18n-0">aangemeld als</span> <script id="metamorph-2-start" type="text/x-placeholder"></script>username<script id="metamorph-2-end" type="text/x-placeholder"></script>
    <a id="ember424" class="ember-view loading" href="#"><span id="i18n-1">log uit</span></a>
  </span>
  <script id="metamorph-0-end" type="text/x-placeholder"></script>
</p>

<p class="navbar-text pull-right header-user-info">
  <script id="metamorph-0-start" type="text/x-placeholder"></script>
  <script id="metamorph-1-start" type="text/x-placeholder"></script>
</p>
<ul id="ember444" class="ember-view"></ul>
<span id="ember447" class="ember-view avatar settings-icon"></span>
<script id="metamorph-1-end" type="text/x-placeholder"></script>
<span class="user-info">
  <span id="i18n-0">aangemeld als</span>
  <script id="metamorph-2-start" type="text/x-placeholder"></script>username<script id="metamorph-2-end" type="text/x-placeholder"></script>
  <a id="ember448" class="ember-view loading" href="#"><span id="i18n-1">log uit</span></a>
</span>
<script id="metamorph-0-end" type="text/x-placeholder"></script>
<p></p>

{{view PR2.NavigationSelectMenuView selectedBinding="view.selected"}}