0

更新この質問をしてから、この機能が不要になるように UI を再設計しました。ただし、同様の問題を抱えている他の人を助けるために、これを開いたままにしておきます。

テンプレート内の要素のコレクションをリストしています。各要素には、リストの右側に開くリンクがあります。1 つがクリックされると、その要素だけを非表示にし、別の要素がクリックされると再び表示したいと考えています。これを行うための現在のアプローチは、モデルで属性 (アクティブ) を true に設定することです。これは、次の 3 つの理由で間違っていると感じます。

  1. この属性は実際にはモデルのスキーマの一部ではなく、任意のものです。これにより、コントローラーの問題のように見えます(機能しない理由については、以下を参照してください)
  2. 最初にすべてのモデルでアクティブを false に設定する必要があり、別のルーターのモデルを変更する必要がありましたが、これが良いか悪いかはわかりません。
  3. 最近の PeepCode スクリーンキャストで、彼は@each.{attribute}配列内の属性にバインドする方法を示しました。this.set("@each.active", false)これは、それらすべてを一挙に設定するために私ができる(のような)何か似たようなことがあるに違いないと感じさせます

コントローラーでメソッドを使用したかったのですが、ハンドルバーの if ステートメントで引数を関数に渡すことができないようです。

リストをレンダリングするために使用しているコードは次のとおりです。

  {{#each note in controller}}
    {{!v-- I was trying to do {{#if isCurrentNote note}} but that seems to be invalid handlebars}}
    {{#unless note.active}}
      <li class="sticky-list-item">
        {{view Ember.TextArea classNames="sticky-note" valueBinding="note.content"}}
        {{#linkTo note note classNames="sticky-permalink"}}
          ∞
        {{/linkTo}}
      </li>
    {{/unless}}
  {{/each}}

そして、ここにルートがあります:

App.NotesController = Ember.ArrayController.extend({
  // v-- this is what I was trying to do, but couldn't pass note in the template
  isCurrentNote: function(note){ 
    return this.get("currentNote") == note;
  }.property("currentNote")
});

App.NoteRoute = Ember.Route.extend({
  setupController: function(controller,model){
    this.modelFor("notes").forEach(function(note){
      note.set("active", false);
    });
    model.set("active", true);
  }
});

私が言ったように、私が持っているものはうまくいきますが、それは間違っていると感じています. 誰か私の疑いを確認したり、私の魂を少し楽にしてくれませんか?

ありがとう!

4

1 に答える 1