在ember.js中实现"条件"后退按钮

Question

我正在开发基于ember.js(版本1.2)的移动应用程序,我正在尝试找到实现全局菜单切换/返回按钮模式的最惯用的方式,这在许多移动应用程序中很常见.具体来说,它是一个位于固定顶部工具栏左侧的按钮,当用户在应用程序的主页/索引视图时切换隐藏的抽屉主菜单,但是当移动到子路径时,按钮显示后退箭头,并且当单击时,它将用户返回到先前查看的路线(或者如果没有先前的历史状态,则返回到索引路线,即,如果用户在加载应用时直接进入子路线).

Fyi,目前我的应用程序是根据应用程序模板中的固定顶部工具栏和菜单切换/后退按钮构建的.理想情况下,无论路由如何转换,无论是通过transitionTo()还是{{#link-to}}帮助等,此功能都将起作用.

所以基本上我想知道Ember是否在内部维护任何类型的可访问历史记录/日志,记录在应用程序生命周期内转换到的路由,以及有条件地更改切换/返回按钮的操作的最佳方式执行及其显示(也称为其图标)取决于当前路线.和/或有没有办法听到余烬的路线变化事件,所以如果需要我可以自己实现这段历史？

Answer 1

我不想成为坏消息的承载者,但我也讨厌让你不知所措.

Ember没有跟踪历史记录,没有一般的用例(特别是因为浏览器会为你跟踪它).

幸运的是,您可以监控应用程序控制器中的路由更改,这样的事情应该让您入门(注意我没有花时间制定一个完美的解决方案,只是向您展示了它所需的基础知识,我会告诉您找出适合你的工作流程)

http://emberjs.jsbin.com/IZAZemEP/1/edit

App.ApplicationController = Em.Controller.extend({
  history: [],

  hasHistory: function(){
    return this.get('history.length')>1;
  }.property('history.length'),

  watchHistory: function(){
    this.get('history').pushObject(this.get('currentPath'));
  }.observes('currentPath'),

  actions: {
    goBack: function(){
       // implement your own history popping that actually works ;)
       if(this.get('hasHistory')){
         this.get('history').popObject();
         window.history.back(); 
         this.get('history').popObject(); // get rid of route change here, don't need it
       }
     }
   }
 });