CODEWITHSUNDEEP
ember.js
Sandeep
Sandeep

Reputation: 605

Ember loader on Model save

is there a way to show loading template when we save a model.

i am able to use Application level loading template when transition to different route but when a model is saved at that time loading template does not show.

this.transitionTo('routeName') takes you to loading.hbs until it gets the promise from server but when doing model.save() it does not show.

Upvotes: 0

Views: 129

Answers (1)

maffews
maffews

Reputation: 525

The loading and error substates are only used when loading routes. There's no way to invoke them during a controller action (unless that action loads a new route, but in that case the states are still tied to loading the new route, not the action).

You can still display a loading template when executing an action by using a property and a partial:

The template:

<!-- templates/components/user-account.hbs -->
{{#if busy}}
  {{partial 'loading-template-name'}}
{{else}}
  {{!-- template content --}}
  <button {{action "save"}}>Save</button>
{{/if}}

The component:

// components/user-account.js
import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    save: function () {
      if (this.get('busy')) {
        return;
      }

      this.get('user').save()
      .then(() => {
        // handle success
      })
      .catch((e) => {
        // handle error
      })
      .finally(() => {
        this.set('busy', false);
      });
   },
  },
})

Upvotes: 1

Related Questions