8

Ember ルーティング システムについて質問があります。

私の Ember-App には、シンプルなリーフレットのフルスクリーン マップがあります。このマップの中心とズーム レベルは、URL クエリ パラメーターから取得されます。ここで、このクエリ パラメータを地図の位置と同期させる簡単な方法があると便利です。そのため、誰かがマップを移動したときに、url クエリ パラメータを新しい値に変更したいと考えています。

シンプルな を使用するtransitionToと、マップを変更してクエリ パラメータを更新し、マップを再度変更するなどのループを開始します。

したがって、私の最初のアイデアは、ルーターから場所の実装を取得し、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 に答える
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 に答える