1

我正在尝试实现一个非常基本的登录表单。我有这个:

<script type="text/x-handlebars" data-template-name="application">
    {{#if userIsLoggedIn}}
        {{outlet}}
    {{else}}
        {{partial "login"}}
    {{/if}}
</script>

<script type="text/x-handlebars" data-template-name="_login">
    <div>Username: {{input value=username type="text"}}</div>
    <div>Password: {{input value=password type="password"}}</div>
    <button {{action 'logIn'}}>l o g i n</button>
</script>

logIn 操作更新 userIsLoggedIn。

首次加载时,它会按预期显示登录表单。

当我登录时,登录表单会消失,正常的东西会按预期呈现到插座中。

在其他地方,我有一个注销按钮,可将 userIsLoggedIn 更改为 false。当我按下它时,正常的东西消失了,登录表单重新出现,正如预期的那样。

在这一点上,一切看起来就像它在第一次加载时所做的那样。但是,如果我再次登录,我会得到一个空白页面。为什么?

我想也许我不应该在 if 块内有一个出口。但是如果我把它拉出来,我有时必须通过将 userIsLoggedIn 检查复制到其他地方来阻止它被使用。而且我找不到一个可以放置重复检查以产生我想要的行为的地方。ApplicationRoute.renderTemplate() 似乎是一个自然的地方,但我尝试了很多东西,但没有想出任何方法来打开和关闭我的整个插座层次结构(上面没有显示大部分),只需要一次登录状态检查。

4

2 回答 2

2

J Quigley,看看这个小提琴:http: //jsfiddle.net/hjdivad/RBLMW/。我相信它正在按照您想要的方式工作。

我试图写一个解释为什么你的小提琴失败了,但我对新路由器的内部结构还不够了解,无法对我的回答充满信心。我相信tl;dr 是这样的:

不要放入{{outlet}}可以在当前路由中更改的条件。

正如丹尼尔所建议的那样,我提供的 jsfiddle 用单独的路线替换了条件。基本上,重要的一点是确保依赖于正在验证的用户的路由层次结构与登录路由层次结构分开,以避免通过缓存路由处理程序意外跳过检查。

于 2013-08-26T04:09:45.890 回答
0

您是否尝试过使用登录路由,如果他们在遇到路由时没有登录,您会阻止该路由,并在他们登录后重试?

谈论新过渡的信息以及如何执行我刚才所说的示例

于 2013-08-23T04:00:57.930 回答