4

私はEmberを学んでおり、次のことを行うための最良の方法を探しています:

ユーザーは、新しいゲームをセットアップするために 3 つのボタンから選択できます: 2 プレーヤー、3 プレーヤー、または 4 プレーヤー。いずれかをクリックすると、次の画面に移動し、選択した番号のゲームが開始されます。プレーヤーの。

Ember でこれを行うにはどうすればよいでしょうか。アクションを使用してそれを行うことができます:

<button {{action "start" 2}} type="button" />
<button {{action "start" 3}} type="button" />
<button {{action "start" 4}} type="button" />

このようにして、コントローラーの start() メソッドでパラメーターを読み取ることができます。

しかし、新しい URL に移行したいのですが、そのためには が必要{{linkTo}}ですよね。しかし、ボタンに基づく値を新しいルート/URL に転送するにはどうすればよいでしょうか? したがって、より一般的な質問は次のようになります。変数を新しいルート/URL に「POST」または「GET」する方法はありますか? 従来のフォームの投稿とリダイレクトのようなものです。動的セグメントを見ましたが、私が考えているものではありません。

4

1 に答える 1

4

プレイヤーの数を読み取り、すべてのコントローラーで使用できる transitionToRoute 関数を使用してユーザーを適切なルートに転送するメソッドをコントローラーの開始に追加できます。

start: function(numberOfPlayers) {
  App.gameConfiguration = updateGameConfigurationBasedOnNumberOfPlayersParamAndBoundVariables();
  this.transitionToRoute('games.start');
}

これにより、ユーザーは /games/start ルートに転送されます。URL にコンテキストまたは動的セグメントはありませんが、このメソッドの使用は、ゲームの開始に必要なゲーム構成を初期化したロジックに依存しています。

すべてのプロパティをstart関数に渡す必要もありません。テンプレートの入力フィールドをモデルのプロパティにバインドし、これらのバインドされた値をstart関数で使用してゲーム構成を作成できます。

これの変形は、ルートにコンテキストを提供するか、URL で動的セグメントを指定することです。次に、開始関数は次のようになります。

start: function(gameConfiguration) {
  this.transitionToRoute('games.start', gameConfiguration);
}

これにより、次のような URL にユーザーが転送されます: /games/:game_configuration_id/start ここで、game_configuration_id は、プレーヤーの数とその他の特性で構成される特定のゲーム構成を表す DS.Model の ID を参照します。

これを設定するには、テンプレート内の一連のゲーム構成を繰り返し処理し、game_configuration を各リンクに渡します。このようなもので十分です:

{{#each game_config in model}}
  <button {{action "start" game_config}} type="button" />
  //This would be the equivalent of doing:
  //<#linkTo 'games.start' game_config>
{{/if}

この構成では、次のようなGamesStartRouteが必要になります。

App.GamesStartRoute = Ember.Route.extend({
  model: function(params) {
    return GameConfiguration.find(params.game_configuration_id);
  }
});

お役に立てれば

于 2013-02-06T19:24:55.137 に答える