I've recently finished the Emberjs tutorial and want to replicate it without following the tutorial to solidify the leanings.
I cannot seem to get the mirage data or even straight route.js data to work in my .hbs file.
mirage/config.js
export default function() {
this.namespace = '/api'
this.get('/job-opening', function() {
return {
data: [{
type: 'job-opening',
id: 12,
attributes: {
title: 'Cleaner',
employer: 'Dirty Co.'
}
}, {
type: 'job-opening',
id: 54,
attributes: {
title: 'Production Master',
employer: 'We Make Things Inc.'
}
}, {
type: 'job-opening',
id: 3,
attributes: {
title: 'King of the Hill',
employer: 'Mount Everest LLC'
}
}, {
type: 'job-opening',
id: 231,
attributes: {
title: 'Garbage Person',
employer: 'Try to be a better person pty ltd'
}
}]
}
})
adapters//application.js
import DS from 'ember-data';
export default DS.JSONAPIAdapter.extend({
namespace: 'api'
});
routes/job-opening.js
import DS from 'ember-data';
export default DS.Model.extend({
title: DS.attr(),
employer: DS.attr(),
});
job-opening.js
import Route from '@ember/routing/route';
export default Route.extend({
model() {
return this.store.findAll('job-opening')
}
});
templates/job-opening.hbs
Doesn't seem to load at all, I assume error in the job-opening.js because when I copy the data from mirage.js and move it straight into the job-opening.js and remove this.store.findAll('job-opening') it will load the hardcoded html.
<div>"Hello World!"</div>
<h3></h3>
<h3></h3>
<br>
<br>
<div>"Goobye Cruel World!"</div>
This makes me thing it's something wrong with how I have mirage setup or maybe the model. I've tried restart the ember server. Currently in development. I've also tried to re-read the tutorial and looked around on stack and didn't find anything. Feel like I've made a simple mistake somewhere..
My goal here is just to get the data on screen with no formatting.
Thanks in advance for any and all help.
Update.. to show what I mean when I add in hardcoded values..
routes/job-opening.js This will produce html when I load the page like below. but no model values..
"Hello World!"
"Goobye Cruel World!"
import Route from '@ember/routing/route';
export default Route.extend({
model() {
//return this.store.findAll('job-opening')
return {
data: [{
type: 'job-opening',
id: 12,
attributes: {
title: 'Cleaner',
employer: 'Dirty Co.'
}
}, {
type: 'job-opening',
id: 54,
attributes: {
title: 'Production Master',
employer: 'We Make Things Inc.'
}
}, {
type: 'job-opening',
id: 3,
attributes: {
title: 'King of the Hill',
employer: 'Mount Everest LLC'
}
}, {
type: 'job-opening',
id: 231,
attributes: {
title: 'Garbage Person',
employer: 'Try to be a better person pty ltd'
}
}]
}
}
});
