Ember Remodal Open on Component didInsertElement

@kyleshevlin wrote:

I am creating an application with an age gate. I want this age gate in a modal and that modal to open when the page loads (eventually, this age gate will create and check for cookies, but I am not to that point yet).

I have chosen to use the addon ember-remodal for this. I have created an age-gate component with an {{ember-remodal forService=true}} inside my component. I have then added the {{age-gate}} component to my application template.

Inside the component file for age-gate, I have injected the remodal service and am attempting to open the modal immediately in the didInsertElement function. It is at this point I get the following error:

Uncaught Error: Assertion Failed: The requested modal, "ember-remodal"
can not be opened because it is not rendered in the current route. 
In order to use ember-remodal as a service, an instance of {{ember-remodal}} 
must currently be rendered, with "forService=true". Try putting it in 
your application template.

I am confused as this component is in the application template and I am at the application route. Any ideas?

More of the code to follow:

// age-gate.js
import Ember from 'ember';

export default Ember.Component.extend({
  remodal: Ember.inject.service(),
  didInsertElement() {
    this.get('remodal').open();
  }
});

{{!-- age-gate.hbs --}}
{{ember-remodal
  forService=true
  confirmButton="Yep"
  cancelButton="Nope"
  title="Are you 21?"
  text="This is a fake site so the answer doesn't really matter, but pretend it does!"
}}

// application.hbs
{{age-gate}}

Any help is appreciated, thanks!

Posts: 1

Participants: 1

Read full topic