CODEWITHSUNDEEP
jsonember.js
n4gys4nyi
n4gys4nyi

Reputation: 933

what are ember js static data best practices

I have some static data which will never change, like the data behind menu items

{
  "menuItems": [{
    "name": "Shows",
    "route": "shows"
  }, {
    "name": "Podcasts",
    "route": "podcasts"
  }]
}

i created a json file in /dist folder and in the application route i'm creating a model from the file like 

export default Route.extend({
  model() {
    return $.getJSON('/static/model.json')
  }
});

is there a better practice to initialize model with static data?

Upvotes: 1

Views: 585

Answers (3)

Gennady Dogaev
Gennady Dogaev

Reputation: 5991

As already was said in other answer, you are not supposed to edit files in dist/ folder.

You can do the following:

  1. Create a new folder under app/. Let's say app/constants/

  2. In that folder create new file menu.js:

    export default {
  "menuItems": [{
    "name": "Shows",
    "route": "shows"
  }, {
    "name": "Podcasts",
    "route": "podcasts"
  }]
};

  3. In any other file import it as import menu from 'project-name/constants/menu';. And I don't think you need a model for this, you can just use what you export.

Upvotes: 4

Theron Cross
Theron Cross

Reputation: 136

You really shouldn't be editing the dist/ folder - that's where Ember sticks compiled code.

If your static data is only used in a single place, it would be more direct to put it where it's used as a const. In this specific case, that's UI code, and probably belongs in the controller.

The model hook is best for loading data that potentially changes each time you hit that route - probably from a back end.

Upvotes: 2

Ember Freak
Ember Freak

Reputation: 12872

  1. You can install ember-cli-json-module and then, any JSON files in either app or tests will be converted to ES6 modules that you can import like so: import myFixture from 'my-app/tests/fixtures/my-fixture';

Upvotes: 1

Related Questions