Ember transition.retry() не удаляет предыдущий вид

Question

Создание простого входа на основе Ember.js Authentication - the right way - при первом доступе пользовательский переход переходит к сеансу просмотра сеанса и после того, как он был проверен, перешел обратно на маршрут, в котором они сначала попытались получить доступ ко всем работам, кроме форма входа в систему остается в поле зрения после перехода и рендеринга просмотров нового маршрута.

Setup является:

Ember: 1.7.0 Ember данных: 1.0.0-beta.8.2a68c63a Рули: 1.3.0 JQuery: 1.11.1

Маршрутизатор:

Router.map(function() { 
    this.resource('sessions', function() { 
    this.route('logout'); 
    this.route('login'); 
    }); 

    this.resource('posts', { path: '/posts' }, function() { 
    this.route('post', { path: '/post/:post_id' }); 
    this.route('new'); 
    }); 
}); 

маршрут

Применение:

export default Ember.Route.extend({ 
    beforeModel: function() { 
    this.transitionTo('posts'); 
    } 
}); 

Сообщений маршрут:

export default Ember.Route.extend({ 
    beforeModel: function(transition) { 
    if(Ember.isEmpty(this.controllerFor('sessions').get('token'))) { 
     return this.redirectToLogin(transition); 
    } 
    }, 

    redirectToLogin: function(transition) { 
    this.controllerFor('sessions').set('attemptedTransition', transition); 
    return this.transitionTo('sessions'); 
    }, 

    model: function() { 
    return this.store.find('post'); 
    }, 

    actions: { 
    ... 
    } 
}); 

Сессии Маршрут:

export default Ember.Route.extend({ 
    // Reset Session Controller to avoid date from a past authentication 
    setupController: function(controller, context) { 
    controller.reset(); 
    } 
}); 

Сессии контроллер:

export default Ember.Controller.extend({ 
    // initialization method to verify if there is a access_token cookie set 
    // so we can set our ajax header with it to access the protected pages 
    init: function() { 
    Ember.Logger.log('sessons.init'); 
    Ember.Logger.log(Ember.$); 
    this._super(); 
    if (Ember.$.cookie('access_token')) { 
     Ember.$.ajaxSetup({ 
     headers: { 
      'Authorization': 'Bearer ' + Ember.$.cookie('access_token') 
     } 
     }); 
    } 
    }, 

    // overwriting the default attemptedTransition attribute from the Ember.Controller object 
    attemptedTransition: null, 


    // create and set the token & current user objects based on the respective cookies 
    token:    Ember.$.cookie('access_token'), 
    currentUser:   Ember.$.cookie('auth_user'), 

    // create a observer binded to the token property of this controller 
    // to set/remove the authentication tokens 
    tokenChanged: function() { 
    Ember.Logger.log('tokenChanged'); 
    if (Ember.isEmpty(this.get('token'))) { 
     Ember.$.removeCookie('access_token'); 
     Ember.$.removeCookie('auth_user'); 
    } else { 
     Ember.$.cookie('access_token', this.get('token')); 
     Ember.$.cookie('auth_user', this.get('currentUser')); 
    } 
    }.observes('token'), 

    // reset the controller properties and the ajax header 
    reset: function() { 
    this.setProperties({ 
     username_or_email: null, 
     password:   null, 
     token:    null, 
     currentUser:  null 
    }); 
    Ember.$.ajaxSetup({ 
     headers: { 
     'Authorization': 'Bearer none' 
     } 
    }); 
    }, 

    actions: { 
    loginUser: function() { 
     Ember.Logger.log('loginUser'); 

     var _this = this; 

     var attemptedTrans = this.get('attemptedTransition'); 
     var data =   this.getProperties('username_or_email', 'password'); 
     Ember.Logger.log(data); 

     // Clear form fields 
     this.setProperties({ 
     username_or_email: null, 
     password: null 
     }); 

     // send a POST request to the /sessions api with the form data 
     Ember.$.post('/api/session', data).then(function(response) { 
     Ember.Logger.log(response); 

     // set the ajax header 
     Ember.$.ajaxSetup({ 
      headers: { 
      'Authorization': 'Bearer ' + response.api_key.access_token 
      } 
     }); 

     // create an apiKey record on the local storage based on the returned object 
     var key = _this.get('store').createRecord('apikey', { 
      accessToken: response.api_key.access_token 
     }); 

     // find a user based on the user_id returned from the request to the session api 
     _this.store.find('user', response.api_key.user_id).then(function(user) { 
      Ember.Logger.log('user->'); 
      Ember.Logger.log(user); 
      // set this controller token & current user properties 
      // based on the data from the user and access_token 
      _this.setProperties({ 
      token:  response.api_key.access_token, 
      currentUser: user.getProperties('username') 
      }); 

      // set the relationship between the User and the ApiKey models & save the apiKey object 
      key.set('user', user); 
      key.save(); 

      user.get('api_keys').content.push(key); 

      Ember.Logger.log(attemptedTrans); 
      if(attemptedTrans) { 
      attemptedTrans.retry(); 
      _this.set('attemptedTrans', null); 
      } 
     }); 
     }); 
    } 
    } 
}); 

Это последний attemptedTrans.retry(), который инициирует переход. Я что-то упускаю?

Answer 1

Ответ Kingpin2k выше указал мне в правильном направлении. Для кого-то другого, спотыкающегося по этому вопросу, он сводился к ошибке в моем использовании {{outlet}}. Мой первоначальный шаблон приложения имеет следующую структуру:

{{#if isAuthenticated}} 
    <div> 
    ... (Nav etc) 
    </div> 

    {{outlet}} 
{{else}} 
    {{outlet}} 
{{/if}} 

Эффект этого было то, что когда-то isAuthenticated верно шаблон перерисовывается и теги сценария, используемые для идентификации формы Войти элементы больше не действительны - следовательно, они не удаляться.

Простое решение было изменить шаблон:

{{#if isAuthenticated}} 
    <div> 
    ... (Nav etc) 
    </div> 
{{/if}} 

{{outlet}} 

Answer 2

Вероятно, у вас плохой html в ваших рулях (отсутствуют закрывающие теги и т. Д.).