2

次の機能を実現したいと考えています。

エントリのリスト - 単一のエントリをクリックすると、このエントリの詳細が現在のエントリの下に表示されます。

ルートを介して単一のエントリにアクセスできるようにする必要があります。tasks/1

私のアプローチ:

{{outlet}}ループ内に含めることでこれを解決しようとしまし#eachたが、うまくいきませんでした。

List -> Details私が見つけたすべてのチュートリアルとソリューションは、単一のコンセントのみを使用するアプローチに基づいています。

どうすればこの問題を解決できるかわかりません。より良い解決策はありますか?

4

1 に答える 1

0

これはルーティングでは不可能です。クリックすると詳細が展開、ロード、表示されるコンポーネントを使用することをお勧めします。

//list.hbs
{{#each task in tasks}}
  {{#task-loader task=task}}
    {{#task-loader-trigger}}
      //list ui
    {{/task-loader-trigger}}
    {{#task-loader-content}}
      //details ui
    {{/task-loader-content}}
  {{/task-loader}}
{{/each}}

//task-loader.js
export default Em.Component.extend({
  isOpen: false
});

//task-loader-trigger.js
export default Em.Component.extend({
  click: function() {
    //toggle isOpen
  }
}};

//task-loader-content.js
export default Em.Component.extend({
  classNameBindings: ['parentView.isOpen:show:hide'],
  didInsertElement: function() {
    //send request and load data
  } 
});

状態 (現在開いているタスク) を維持したい場合は、クエリ パラメータを使用します。お役に立てれば :)

于 2015-03-23T11:39:12.667 に答える