EmberJSを使用してページ内のデータをリロードする方法

Question

EmberJSを使用して開発された検索結果ページがあります。 Ember.Routeを使用してAPIからデータを読み込みます。私が使っていた検索APIは非常に遅いです。そのため、キャッシュAPIからデータをロードすることにしました。しかし、問題は、キャッシュに古いデータが残っている可能性があるということです。そこで、検索APIを使用して、既に読み込まれたページのデータを再読み込みすることにしました。

私の既存のルートのコードだけで、検索APIを呼び出し、JSONレスポンスを返しています、上記のコードでは、この

define(‘search’, ['jquery'], function($) { 
    var route = Ember.Route.extend({ 
    model: function() { 
     return searchApiCall(someParameter); 
    }, 
    setupController: function(controller, model) { 
     controller.set('model', model); 
    } 
    }); 
    return route; 
}); 

ようになります。しかし、私が欲しいのは、以下のようなものです。

define(‘search’, ['jquery'], function($) { 
    var route = Ember.Route.extend({ 
    model: function() { 
     setTimeout(function(){ 
     return searchApiCall(someParameter); 
     }, 10); 
     return cachedSearchResult(someParameter); 
    }, 
    setupController: function(controller, model) { 
     controller.set('model', model); 
    } 
    }); 
    return route; 
}); 

は、したがって、上記のコードで探しています何を最初にキャッシュされた結果を渡すときに利用でき、その後何とか実際の検索APIからの結果をロードすることです。

私に教えてください、これはEmberJSのための最良の方法です。

Answer 1

私のアプローチは、afterModelフックを使用することです。これはEmberのバージョンが少し古いように見えますが、うまくいけばそれが利用可能です。

const set = { Ember }; 

define(‘search’, ['jquery'], function($) { 
    var route = Ember.Route.extend({ 
    model: function() { 
     return { 
      searchResults: cachedSearchResult(someParameter); 
     }; 
    }, 
    setupController: function(controller, model) { 
     controller.set('model', model); 
    }, 
    afterModel: function(model) { 
     let searchResults = searchApiCall(someParameter); 
     set(model, 'searchResults', searchResults); 
    } 
    }); 
    return route; 
});