Call API endpoint provided by back-end


#1

Hello,

I’m trying to convert some of the scripts on my site to start using Ember and running into some problems. I haven’t found a good example of what I’m trying to do so I’m struggling with the concepts.

Currently the back-end provides several API endpoints for me to call (e.g. /api/users’, ‘/api/orders’, etc.) which are called to generate a dashboard. I need to now use Ember to call those endpoints and then populate Handlebars. We use Handlebars already, just not with Ember, so I want to use Ember for that.

Problem is all of the examples I’m finding include routing and I don’t need routing because the endpoints already exist. So, can anyone help me with an example of this? Imagine you’re consuming some public API you can’t modify and so Ember just needs to consume the endpoint and then plop the data into a Handlebar template. Again, the endpoint already exists so I don’t need to specify a route because it already exists from the back end.


#2

You can load the models user and orders in the applications or root index route with Ember.RSVR.hash like this:

so there is no 1:1 connection between routes and models.


#3

Thanks for the reply. I want to make sure I totally understand this concept so let’s go a step further.

I have my site on example.com

The example (for me) isn’t totally clear how to account for each of these instances:

example.com/api/orders api.example.com/orders another-domain.com/api/orders

How does Ember know the endpoint to call outside of the content: store.findAll('post') I assume routes to /api/post? How can I get this to touch the endpoint and populate the model on page load? Lastly, I’m used to requiring a Handlebars template and passing data like so:

const someTemplate = require('./path/to/template.hbs');
$('.some-object').html( someTemplate( someData ) );

So how would I pass the model data into the template using Ember and how would it know where to place the template in the DOM? Trying to do this right and this is my first attempt at Ember.

Thanks!


#4

Perhaps clone https://github.com/broerse/ember-cli-blog and try to run it to see how all things connect. You don’t need the CouchDB backend to run it.

I also recommend reading: https://balinterdi.com/rock-and-roll-with-emberjs/

If you create models exampleorder, apiorder, anotherorder and create custom adapters for them you can access the models from one route. See http://stackoverflow.com/questions/25654937/associating-custom-adapters-with-specific-models-in-ember-cli


#5

Thanks, I’m going through that example now. Another question I have, currently we write es6, use Babel to transpile and Webpack to uglify/bundle/etc. When trying these examples in our code base I get errors on

import Ember from 'ember';

Likely because no npm package exists that is called “ember”. Am I able to use my current tech stack and add Ember into it? Do you know of any good examples of this?

Thanks


#6

Can’t help with that. We use ember-cli everywhere.