绑定到StateManager的Ember插口在更改状态两次后不会渲染

Question

我已根据此答案设置状态管理器以跟踪用户登录状态:根据登录状态更改导航栏

但是,我想把它带到下一步,不仅根据状态更新导航栏,而且还有主模板本身.我已经得到了这个大部分工作,所以当你点击登录按钮时它会显示'欢迎你现在登录的消息.' 但是,如果您注销并尝试再次登录,它只会显示一个空白屏幕,就好像它没有正确地重新呈现索引路径一样.这是我的问题的JSFiddle.注意当您单击登录/注销然后第二次登录时会发生什么.不显示"欢迎"消息.

这是我的索引模板:

    {{render navbar}}
        {{authState}}
{{#if isAuthenticated}}
    {{outlet}}
{{else}}
    {{render login}}
{{/if}}

我可以看到'authState'是正确的,但第二次登录时没有呈现'outlet'...

这是完整的jsfiddle:

http://jsfiddle.net/Benmonro/HmJyu/1/

澄清

@ham要求澄清,所以这里是:

我在这里要完成的主要事情是,当状态管理器改变状态时,isAuthenticated当前呈现的内容{{outlet}}应该被换出来呈现的{{render login}}内容可能真的是任何模板.重点是{{outlet}}将显示和隐藏状态变化......

Answer 1

它不起作用的原因是你有两个 id 的 DOM 节点index。在你的小提琴中，</script>HTML 窗格的末尾有额外的内容，但我想这并不重要。

DOM 中的 ID 必须是唯一的，否则您可能会遇到像这样的一些意想不到的问题。您可以在此处阅读更多信息https://developer.mozilla.org/en/docs/DOM/element.id

这是你的小提琴的工作叉 - http://jsfiddle.net/wbednarski/eMcXq/

顺便说一句，您可能会发现也很有帮助 - Difference Between == and === in JavaScript