在更改状态两次后，绑定到StateManager的Ember插座不会呈现 [英] Ember outlet bound to StateManager doesn't render after changing state twice

问题描述

我已经设置了一个状态管理器来跟踪用户登录状态，根据这个答案：根据登录状态更改导航栏

I've setup a State Manager for tracking user login state, based on this answer here: Change Navbar based on login state

但是，我想把它带到下一步，并且不仅根据状态，但主要模板本身。我已经得到这个大部分工作，所以当你点击登录按钮，它将显示'欢迎你现在登录消息'。但是，如果您注销并尝试再次登录，它只显示一个空白屏幕如果不正确地重新渲染索引路由。这是一个JSFiddle与我的问题。注意当您单击登录/注销然后再次登录第二次会发生什么。 欢迎消息不显示。

However, I'd like to take it to the next step and have not only the navbar update according to the state, but the main template itself. I've gotten this mostly working so that when you click on the login button it will show you the 'welcome you're now logged in message.' However, if you logout and try to login again, it just shows a blank screen as if it is not correctly re-rendering the index route. Here's a JSFiddle with my issue. Notice what happens when you click on login / logout and then login a 2nd time. the 'welcome' message is not displayed.

这是我的索引模板：

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

我可以看到'authState'是正确的，但是'出口'没有第二次登录...

I can see the 'authState' is correct, but the 'outlet' is not rendered the 2nd time I login...

这是完整的jsfiddle：

Here is the complete jsfiddle:

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

澄清

@ham要求澄清，这里是：

@ham asked for a clarification, so here goes:

我要在这里完成的主要事情是，当一个州经理改变状态 isAuthenticated 然后在 {{outlet}} 中呈现的内容应该换成在 {{render login}} 这真的可以b任何模板要点是 {{outlet}} 将显示和隐藏状态更改...

The main thing I'm trying to accomplish here is that when a state manager changes the state of isAuthenticated then what is currently rendered in {{outlet}} should be swapped out for what is rendered in {{render login}} which could really be any template. The main point is that {{outlet}} will show and hide w/ the state change...

推荐答案

您没有从路由器中转换，但只能更改您的 LoginStateManager 。如果您在 App 创建中包含路由输出，您将看到输出，并且没有从欢迎状态转换。

You are not transitioning out of your router, but are only changing the state of your LoginStateManager. If you include the routing output in your App creation, you will see the output, and the lack of transitioning out of your "welcome" state.

只需将 App 更改为：

App = Ember.Application.create（{LOG_TRANSITIONS：true}）;

App = Ember.Application.create({ LOG_TRANSITIONS: true });

您将看到使用您的 / code> -button在 navBar 将执行一次正确的功能，其中登录上的按钮表单不过渡状态，因此不显示正确的结果。这是因为在 App.NavBarController 中执行 this.transitionToRoute（welcome）。

You will see that using your login-button on the navBar will perform the correct function once, where the button on the login form doesn't transition state, and therefor doesn't show the correct result. This is because in the App.NavBarController you perform this.transitionToRoute("welcome").

只需扩展所有登录和注销：
this.transitionToRoute（welcome）或 this.transitionToRoute（index），它的作用就像一个魅力。

Just extend all your logins and logouts with: this.transitionToRoute("welcome") or this.transitionToRoute("index") and it works like a charm.

[edit]在这里添加了一个例子： http://jsfiddle.net/AlphaEagle/rGNca/4/ 希望它有帮助！ [/ edit]

[edit] Added an example fiddle here: http://jsfiddle.net/AlphaEagle/rGNca/4/ Hope it helps! [/edit]

这篇关于在更改状态两次后，绑定到StateManager的Ember插座不会呈现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！