Question

我对Ember路由系统有疑问。

在我的Ember-App中，我有一个简单的传单全屏地图。此地图的中心和缩放级别来自URL查询参数。现在，有一种简单的方法可以使这个查询参数与地图位置保持同步。所以当有人移动地图时，我想将url查询参数更改为新值。

当我使用简单的transitionTo时，我开始循环更改地图并更新查询参数，再次更改地图等等。

所以我的第一个想法是从路由器获取位置实现并手动更改URL。但我不知道该怎么做。用这种方式使用Ember也是错误的。

Answer 1

经过多次下面的回答，在Ember之后，您也可以这样做，这样您就不会进行转换或重新加载数据/渲染

Ember.run(function(){ 
    window.history.replaceState( {} , 'foo', '/foo' );
});

或旧版浏览器访问哈希：

Ember.run(function(){
    location.hash = 'foo';
});

Answer 2

http://emberjs.com/api/classes/Ember.HistoryLocation.html#method_replaceState

在packages / ember-routing / lib / location / history_location.js中定义：134

我没有测试过这个，但是：

Ember.HistoryLocation.replaceState(<string>);

应该有效。

我的同事也建议使用路由器来完成此任务：

http://emberjs.com/blog/2013/02/15/ember-1-0-rc.html#stq=&stp=0

router.replaceWith('index');

Answer 3

要添加以前的答案，在您想要更改URL时使用更改URL的直接方法，在当前的Ember版本上，可以选择将查询参数链接到控制器属性。

从Ember guide page编译的简单示例：

App.MapController = Ember.ObjectController.extend({
  queryParams: ['zoom', {latitude: 'lat'}, {longitude: 'lon'}],

  zoom: 10,
  latitude: null,
  longitude: null,

  mapWindowChanged: function {
    MapApi.reposition(this.zoom, this.latitude, this.longitude);
  }.observes('zoom','latitude','longitude')
});

以这种方式使用查询参数时，控制器/视图代码只能更改绑定的控制器属性，查询参数将自动更新。

使用Ember.Route queryParams property更改查询参数影响路径事件的方式，如下所示：

App.MapRoute = Ember.Route.extend({
  queryParams: {
    lat: {
      refreshModel: true,
      replace: true, 
    },
    long: {
      refreshModel: true, 
      replace: true, 
    },
    zoom: {
      replace: true
    }
  }
});

这将告诉Ember在倾斜地图时从服务器重新加载所需的部件，但在更改缩放时则不会。此外，更改参数不会将状态项推送到浏览器历史记录。

更改URL而不进行转换

3 个答案: