我在尝试调试以下失败的原因时遇到了很多麻烦:
给定以下模板:
<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>
和 PR2.NavigationSelectMenuView 如下:
PR2.NavigationSelectMenuView = Em.View.extend({
tagName: 'ul'
});
当我转到仪表板时(并且 view.isDashboard 为真),图像被渲染,而 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>
直接导航到另一个页面(错误输出)时的 HTML 输出,变形从 p-tag 开始,但随后 p 关闭,然后是内容,然后是另一个 p-tag。
<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"}}
一切正常