Rendering an image from model string in specific events only


Hey guys,

I was trying to get an image to load in a certain setup. I have a dynamic events page where the model fetches data from firebase. In each case, the route does not change the page since it is a nested template. However, in certain “OFF” day events I want an image to appear for all the “OFF” named events only. I want it to replace the Event data when clicked and have just the image appear. Here are some of my files:

/* single.event hbs */


Address: {{event.address}}

Contact: {{}}

Website: {{}}

{{#if isImageShowing}}

Hide {{else}} Show {{/if}}


import Ember from ‘ember’;

export default Ember.Component.extend({ isImageShowing: false, actions: { imageShow() { this.set(‘isImageShowing’, true); }, imageHide() { this.set(‘isImageShowing’, false); } } });

import Ember from ‘ember’;

export default Ember.Route.extend({ model: function(params) { return‘event’, params.event_id);


setupController: function(controller, model){
	controller.set('event', model);