10

質問:

新しい Ember.js ルーターを使用してプログラムで新しいルートに移行するにはどうすればよいですか?

背景/コンテキスト

send古い Ember.js ルーターを使用すると、ルーターのメソッドを使用してルート/状態間をプログラムで遷移できます。

//OLD Router Syntax
App = Ember.Application.create({
  Router: Ember.Router.extend({
    root: Ember.Route.extend({
      aRoute: Ember.Route.extend({
        route: '/',
        moveElsewhere: Ember.Route.transitionTo('bRoute')
      }),
      bRoute: Ember.Route.extend({
        route: '/someOtherLocation'
      })
    })
  })
});
App.initialize();

プログラムによる移行:

App.get('router').send('moveElsewhere');

新しい Ember.js ルーター (以下) を考えると、どうすれば同じことを達成できるでしょうか?

//NEW Router Syntax
App.Router.map(function(match) {
  match('/').to('aRoute');
  match('/someOtherLocation').to('bRoute');
});

回避策 (悪い解決策?)

これは正しくありませんよね?:

window.location = window.location.href + "#/someOtherLocation";

新しいルーターで動作しないように見える解決策:

1)インスタンスでsendメソッドを呼び出すApp.router

> App.router.send("moveElseWhere")
TypeError: Cannot call method 'send' of undefined

2) Route を明示的に宣言し、イベントを設定する

App.ARoute = Ember.Route.extend({
  events: {
    moveElseWhere: function(context){
       this.transitionTo('bRoute');
    }
  }
);

App.UploadRoute.moveElseWhere()
TypeError: Object (subclass of Ember.Route) has no method 'moveElseWhere'

注: 執筆時点では、Ember.js ルーターのドキュメントはまだ古いルーターを参照していますが、Ember.js ルーター ガイドは新しいルーターを参照しています。

4

3 に答える 3

9

この Router 定義を仮定します:

App.Router.map ->
  this.resource('old_route', {path : ""})
  this.resource('new_route', {path : ":model_id"})

コントローラーをコンテキストとして持っている場合new_route、関数でに移動できます。old_route.transitionToRoute()

コントローラーから

this.get('target').transitionToRoute('new_route', model_instance)

this.get('target')- コントローラーから現在のルートを返します

ビューから

this.get('controller').get('target').transitionToRoute('activity_detail', activity)

ノート

関数 *transitionTo() は1.0.0.RC3 で非推奨になりました

于 2013-05-06T08:43:36.180 に答える
4

新しいルーター API で使用できますtransitionToが、別の方法でルーター インスタンスにアクセスする必要があります。

可能性については、新しい Ember ルーターのアクセス インスタンスの質問の回答を参照してください。

于 2013-01-07T08:36:08.757 に答える
1

{{linkTo}} ヘルパーを使用して、新しいルートへのリンクをトリガーします。

#your template

{{#linkTo allTodos activeClass="selected"}}All{{/linkTo}}

#your router

    App.Router.map(function (match) {
        match("/").to("todos", function (match) {
            match("/").to("allTodos"); // will fire this router
            match("/active").to("activeTodos");
            match("/completed").to("completedTodos");
        });
    });

お役に立てれば :)

于 2013-01-07T02:21:42.160 に答える