0

Emblem テンプレートの条件付きクラス バインディングから一貫した動作を得ることができません。テンプレートはタスク リスト用で、関連するスニペットは次のようになります。

each task in content
  tr.task class=task.completed:complete
    td
      a.completion{ action toggleTask task}
        if task.completed
          | ✔
        else
          span.larger ☐

したがって、ここでの考え方は、タスクが完了した場合、表の行全体に「完全な」CSS クラスが適用されている必要があるということです。少し下に、タスクが完了すると、空のチェックボックスの代わりにチェック マークが表示されます。(これはすべて、 Task モデルのブール値プロパティとして定義されている task.completed の評価に依存します。)

アプリケーションの他の場所から関連するルート (tasks.index) に移動すると、すべてが正常に機能します。しかし、このルートを直接ロードしたり、ページをリロードしたりすると、クラス バインディングは評価されませんが、少し下の条件分岐は問題なく機能します。

これはモデルの非同期読み込みの問題なのか、Ember での linkTo 経由とページ読み込み経由のルート入力の違いなのか、それともエンブレム/ハンドルバー テンプレートの評価の奇妙さなのか、疑問に思っています。問題は、壊れたケースでは、モデルの読み込みが完了した後にクラス バインディングが正しく再評価されていないことです。

参考までに、私のルート定義は次のようになっています。

App.TasksRoute = Ember.Route.extend
  setupController: (controller, model) ->
    @controllerFor('application').set 'currentRoute', 'tasks'
    @controller.set 'content', model

App.TasksIndexRoute = App.TasksRoute.extend
  model: (params) ->
    App.Task.find()

他の誰かがこの問題を見たことがありますか?

4

0 に答える 0