使用Ember.js的Hashbang URLs

我想設置我的Router使用「hashbang」URL（#!）。使用Ember.js的Hashbang URLs

我想這一點，但顯然它不工作：

App.Router.map(function() { 
    this.route("index", { path: "!/" }); 
    this.route("otherState", { path: "!/otherState" }); 
});

這是可以做到的灰燼？

來源

2013-02-18 twiz

我設法通過覆蓋'Ember.HashLocation'屬性來添加一些'！'到幾個字符串來工作。我不完全確定這是否會最終破壞任何東西。如果沒有人發佈這樣做的更合法的方式，我會添加我的代碼作爲答案。 – twiz 2013-02-18 05:14:35

擴展Ember.HashLocation將是要走的路。

要獲得乾淨的實施，您可以執行以下操作。

Ember.Location.registerImplementation('hashbang', Ember.HashLocation.extend({ 
    // overwrite what you need, for example: 
    formatURL: function(url) { 
    return '#!' + url; 
    } 
    // you'll also need to overwrite setURL, getURL, onUpdateURL... 
})

然後指示你的應用程序路由器使用您的自定義實現位置管理：

App.Router.reopen({ 
    location: 'hashbang' 
})

來源

2013-02-18 10:07:08

很好的答案。我沒有在我的解決方案中使用registerImplementation。這絕對會使它更清潔。我編輯了你的答案，包括完整的代碼來完成這項工作，因爲'formatURL'之外還有其他一些必須做的更改。 – twiz 2013-02-18 18:39:03

由於某種原因，我對你的答案的編輯被拒絕了。不確定交易是什麼。無論如何，我只是發佈了自己的答案和代碼，以完全實現hashbang URL功能。 – twiz 2013-02-19 00:03:10

泰迪Zeenny的答案大多是正確的，registerImplementation似乎是實現這種清潔方式。我試圖編輯他的答案，使其完全回答這個問題，但我的編輯被拒絕了。

反正這裏是完整的代碼，使灰燼使用hashbang網址：

(function() { 

var get = Ember.get, set = Ember.set; 

Ember.Location.registerImplementation('hashbang', Ember.HashLocation.extend({ 

    getURL: function() { 
     return get(this, 'location').hash.substr(2); 
    }, 

    setURL: function(path) { 
     get(this, 'location').hash = "!"+path; 
     set(this, 'lastSetURL', "!"+path); 
    }, 

    onUpdateURL: function(callback) { 
     var self = this; 
     var guid = Ember.guidFor(this); 

     Ember.$(window).bind('hashchange.ember-location-'+guid, function() { 
       Ember.run(function() { 
        var path = location.hash.substr(2); 
        if (get(self, 'lastSetURL') === path) { return; } 

        set(self, 'lastSetURL', null); 

        callback(location.hash.substr(2)); 
       }); 
     }); 
    }, 

    formatURL: function(url) { 
     return '#!'+url; 
    } 

})); 

})();

然後，一旦你創建你的應用程序，你需要改變，以利用「hashbang」位置實現路由器：

App.Router.reopen({ 
    location: 'hashbang' 
})

來源

2013-02-18 23:59:41 twiz

不錯，只有幾點意見： - 最好重新打開'App.Router'而不是'Ember.Router'（所以你保持默認值是乾淨的，特別是如果你正在測試） - 你不需要覆蓋' init'和'willDestroy'，因爲你正在擴展HashLocation，所以這些函數將被繼承並且代碼會更簡單。 – 2013-02-19 09:21:12

謝謝。我改變了你說的話。 – twiz 2013-02-19 21:01:55

此方法完美工作，但在最後的燼引發棄用消息;我們需要做什麼來使用這個，而不使用棄用的代碼？ – 2014-02-03 17:04:09

使用Ember.js的Hashbang URLs

回答

相關問題