8

我有一个关于 Ember 路由系统的问题。

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

当我使用 simpletransitionTo时,我开始循环更改地图并更新查询参数,再次更改地图等等。

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

4

3 回答 3

8

在对我上面的回答投了很多反对票之后,在 Ember 中你也可以这样做,这样你就不会经历过渡或重新加载数据/渲染

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

或者对于旧版浏览器访问哈希:

Ember.run(function(){
    location.hash = 'foo';
});
于 2014-03-04T00:03:47.163 回答
3

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');
于 2013-09-29T22:43:40.627 回答
2

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

Ember 指南页面编译的一个简单示例:

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 属性更改查询参数影响路由事件的方式,如下所示:

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

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

于 2014-12-14T06:58:57.810 回答