ember data model is not reloading even after queryParams is changing

0
votes

I want my model to reload when the queryParams has changed. queryParams change is reflecting in the URL but model reload is not happening. I followed the ember.js guides (https://guides.emberjs.com/v2.6.0/routing/query-params/) on making full-on transition. I've my queryParams declared in my controller 

  //controllers/service/service.js
   import Ember from 'ember';
   export default Ember.Controller.extend({
        queryParams:['showFriends']
   });

   //routes/service/service.js
   model(params){
       return this.store.query('service', params);
   },
   actions:{
      updatePage(params){
         this.transitionTo('service',{queryParams:{showFriends:params}});
     },
   },
   queryParams:{
     showFriends:{
        refreshModel:true
     }
   },

I'm calling updatePage from a component which passes params as true or false based on a checkbox selection. The component is called from application.hbs file as below

{{test-component model=model updatePage="updatePage"}}

If I remove refreshModel:true from my route, I see the URL is updating but my model is not reloading (as expected according to the docs).

Since, I'm doing a full-on transition I added the line refreshModel:true which gives me error 

ember.debug.js:32096 TypeError: this.refresh is not a function
at Class.queryParamsDidChange (ember.debug.js:26286)
at Object.triggerEvent (ember.debug.js:28580)
at Object.trigger (ember.debug.js:53473)
at fireQueryParamDidChange (ember.debug.js:52255)
at Object.queryParamsTransition (ember.debug.js:51983)
at Object.getTransitionByIntent (ember.debug.js:51913)
at Object.transitionByIntent (ember.debug.js:52018)
at doTransition (ember.debug.js:52590)
at Object.transitionTo (ember.debug.js:52087)
at Class._doTransition (ember.debug.js:28291)

I spent more than 2 days on this issue but of no use. Anybody who has faced this similar issue or has any idea on how to solve this would be a great help to me. Thanks in advance

2
ember.jsember-dataember-cliember-routerember-model
you can try this.transitionTo('service.service',{queryParams:{showFriends:params}}); ..show me your router code it will help lot for debugging – Ember Freak

2 Answers

1
votes

Put queryParams:{ showFriends:{ refreshModel:true } } in corresponding route.

Routes are responsible for fetching models, so it should be there

1
votes

Answering my own question, thought if somebody is facing the same problem. Solution is simple but you know finding out the right spot is the difficult task.

I've a service injected into all of my routes and the name of the service is "refresh". When I call refreshModel:true in the route as we all know ember in the backend calls this.refresh() method.

But, here in my case, a service with refresh name is already been injected in the application, ember is not calling this.refresh() method of the route instead calling the injected service which is obviously not a method.

So, it is throwing me a error this.refresh is not a function. Ember would've have given the error more specifically but again its hard for anyone to expect this scenario. Anyways, thanks for all who gave the solutions which directed me in the right path.