ember.js - Emberjs 1.0 で LoadingRoute / LoadingTemplate のレンダリングを遅らせる方法

Question

loadingRoute 機能を使用すると、Ember.js アプリで読み込みインジケーターを表示する優れた方法が得られます。しかし、通常、読み込み時間が非常に短い場合はどうでしょうか? ページ遷移は、ロード インジケーターのちらつきでうるさくなりすぎます。したがって、特定のしきい値を超えるまで、実際の読み込みレイヤーのレンダリングを遅らせた方がよいと思います。これを行うには数え切れないほどの方法がありますが、最も優れた方法は何ですか?

Answer 1

を遅らせるために私が考えることができる良い方法の 1 つはLoadingRoute、テンプレートのレンダリングを遅らせることです。Ember.run.latersetTimeout

App.LoadingRoute = Ember.Route.extend({
  renderTemplate: function() {
    Ember.run.later(this, function() {
      this.render();
    }, 1000); // put here the treshold you might find appropriate in ms
  }
});

model遅延がタイムアウトする前にフックが promise を解決した場合、LoadingRouteはまったく表示されません。これは、必要な動作です。

それが役に立てば幸い。

Answer 2

私が見つけた解決策は次のとおりです。

App.LoadingRoute = Em.Route.extend({
  deactivate: function() {
    var timer = this.get('timer');
    if (timer)
      Em.run.cancel(timer);
  },

  renderTemplate: function(controller, model) {
    var self = this;
    // Only render the loading indicator after 0.5s
    var timer = Em.run.later(this, function() {
      self.render('loading')
    }, 500);
    this.set('timer', timer);
  }
});

しきい値を超える前にプロミスが解決されると、レンダリングがキャンセルされます。