Get request Ember.js on Sails.js

Question

I am creating a web application using Sane stack, which uses Ember.js on the client side as a JavaScript framework, and on the server side it uses Sails.js as a node.js framework. I structured my application architecture as follows:

I am trying to get some data from the Jira API REST, I can, for example, GET a Project's information from the JIRA API REST with sails.js using a simple controller :

//server/app/controllers/JiraController
module.exports = {
    loadProject : function(req, res){
        console.log("Jira contoller");
        var Http = require('machinepack-http');
        process.env.NODE_TLS_REJECT_UNAUTHORIZED = "0";
        Http.sendHttpRequest({
            url: '/rest/api/2/project/',
            baseUrl: 'https://jira.domain.com',
            method: 'get',
            headers: {
              "Authorization": "Basic YWxhYS52654f0bWFuaTphbGFhNDE0NA=="
            }
        }).exec({
            serverError: function(result) {
                res.send("server error" + JSON.stringify(result));
            },
            success: function(result) {
             // res.send("Projects loaded successfully");
             res.send(result);
            }
        });
    }    
};

In server/app/config/routes : I add :

'get /projects' : 'JiraController.loadProject'

But what I want to do is get the Project data on the client side with Ember.js, in other words, I want that sails.js request the JIRA API Rest, and then pass the data (JSON) to Ember.js which will display it in a View.

How can I do that please !?

EDIT :

In the client side I did this :

//pods/components/project/component.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return Ember.$.getJSON('/api/v1/projects');
  }
});

How can I render this JSON in my view ?

Answer 1

I think there is some implementation fault in your code.

Very first thing is you are writing a Ember.Route inside a component.js file, which is wrong. This way your route is called component and as this is the wrong location, your model gets empty. There is one more reason why this is not working. See, how you are calling model hook! The correct way is as follows:

import Ember from 'ember';

export default Ember.Route.extend({
    model: function() {
        return Ember.$.getJSON('/api/v1/projects');
    }
});

Put this at app/routes/components/component.js This way your route is called component. Now you must be able to access the equivalent model data in your view which should ideally be at app/templates/components/component.hbs.