Ember:如何让路由器和控制器协同工作？

Question

对于我的登录/注销场景,我在ember中实现了条件路由:

 App.Router = Ember.Router.extend({

    //needs controller handling
    //goLoggedIn: Ember.Route.transitionTo('loggedIn'),
    goLoggedOut: Ember.Route.transitionTo('loggedOut'),

    root: Ember.Route.extend({
      index: Ember.Route.extend({
        route: '/',
          enter: function(router) {
              var logged = getLoginState();
              Ember.run.next(function() {
                  if (logged) {
                      router.transitionTo('loggedIn');
                  } else {
                      router.transitionTo('loggedOut');
                  }
              });
          }
      }),

      loggedIn: Ember.Route.extend({
        connectOutlets: function(router, context){
          ...
        }
      }),

      loggedOut: Ember.Route.extend({
        connectOutlets: function(router, context){
          ...
        }
      })
      ...

我的index.html对于登录视图说

    <!-- Template for out -->
    <script type="text/x-handlebars" data-template-name="out">
      <hr /><br />
      <h1>Logged Out</h1>
      <span>Login with "test/test"</span><br /><br />
      <label>Username: </label>{{view Ember.TextField valueBinding="App.OutController.username"}}<br />
      <label>Password: </label>{{view Ember.TextField valueBinding="App.OutController.password" type="password"}}<br />

      {{#if App.loginController.isError}}
        <span class="login-error">Error: Invalid username or password.</span><br />
      {{/if}}

      <br /><button {{action goLoggedIn href=true}}>Login</button>
    </script>

现在我将这个动作简单地委托给我的路由器.我知道我可以将它委托给我的控制器以及:

 action login target="controller"

但在那之后,如何在我的路由器中执行transitionTo功能？因为我知道这不应该在我的控制器中完成.那么如何将它传递给我的路由器？

可能我错了,我必须让{{action goLoggedIn href=true}}.然后我的路由器将一个函数委托给我的控制器,我得到一个响应.而不是goLoggedIn: Ember.Route.transitionTo('loggedIn')我需要像App.LoginController.doLogin之类的东西goLoggedIn: Ember.Route.transitionTo('loggedIn').在这种情况下如何实施呢？

编辑:

像这样？

 App.Router = Ember.Router.extend({

    //needs controller handling
    goLoggedIn: Ember.Route.transitionTo('loggedIn'),
    goLoggedOut: Ember.Route.transitionTo('loggedOut'),

    root: Ember.Route.extend({
      index: Ember.Route.extend({
        route: '/',
          enter: function(router) {
              var logged = getLoginState();
              Ember.run.next(function() {
                  if (logged) {
                      router.transitionTo('loggedIn');
                  } else {
                      router.transitionTo('loggedOut');
                  }
              });
          }
      }),

      loggedIn: Ember.Route.extend({
        connectOutlets: function(router, context){
          ...
        }
      }),

      loggedOut: Ember.Route.extend({
        connectOutlets: function(router, context){
          ...
        },
        goLoggedIn: function(router, evt) {
          router.get('inController').tryLogin()
          router.transitionTo('loggedIn')
        }
      })
      ...

我明白了:Cannot call method 'split' of undefined

编辑2:

它现在正在运作.我不得不删除href=true.谢谢

Answer 1

在典型的Ember应用程序中,target每个控制器的属性都设置为Router实例.如果要将操作发送到控制器然后再发送到路由器,则可以通过说明在控制器方法中执行此操作this.get('target').send('goLoggedIn', optionalEvt)

我建议您直接将操作发送到路由器.您可以让一个函数处理在转换之前可以在一个或多个控制器上调用方法的操作.例如:

...
{{action log href=true}}
...

logIn: function(router, evt) {
  router.get('userController').prepareForLogin()
  router.transitionTo('loggedIn')
}