使用Ember.js的Hashbang网址 [英] Hashbang URLs using Ember.js

问题描述

我正在设置我的路由器使用hashbangURL（＃！）。 p>

我试过这个，但显然它不起作用：

 应用程序.Router.map（function（）{
 this.route（index，{path：！/}）; 
 this.route（otherState，{path：！/ otherState }）; 
}）; 
  

这是否可以在Ember中执行？

解决方案

Teddy Zeenny的答案大多是正确的，而 registerImplementation 似乎是一个干净的方式来实现。我试图只是编辑他的答案，使其完全回答这个问题，但我的编辑被拒绝。

无论如何，这里是使Ember使用hashbang URL的完整代码： / p>

 （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 =！ ; 
 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，'lastSet URL'）=== path）{return; } 
 
 set（self，'lastSetURL'，null）; 
 
 callback（location.hash.substr（2））; 
}）; 
}）; 
}，
 
 formatURL：function（url）{
 return'＃！'+ url; 
} 
 
}））; 
 
}）（）; 
  

然后，一旦您创建了应用程序，您需要更改路由器以利用hashbang位置实现：

  App.Router.reopen（{
 location：'hashbang'
}）
  

I am trying to set up my Router to use "hashbang" URLs (#!).

I tried this, but obviously it doesn't work:

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

Is this possible to do in Ember?

解决方案

Teddy Zeenny's answer is mostly correct, and registerImplementation seems to be a clean way to implement this. I tried to just edit his answer to make it fully answer the question, but my edit got rejected.

Anyway here is the full code to make Ember use hashbang URLs:

(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;
    }

}));

})();

Then once you create your app you need to change the router to utilize the "hashbang" location implementation:

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

这篇关于使用Ember.js的Hashbang网址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！