Push data in Ember store in service layer and return promise

Question

I am using ember 2.7.0 In one of my ember service i am returning an hardcoded(Yet to call rest endpoint) data instead i want to return the promise with the hardcoded data. In controller if the promise is success then push the hardcoded data to ember store otherwise return error object.I am entirely new to ember so i don't know how to achieve this.

Below is my service file

customer.js

import Ember from 'ember';

export default Ember.Service.extend({
  getIndividualCustomer(id) {
// return Ember.$.ajax({
//   url: `/api/v1/customers/${id}`,
//   type: 'GET'
// });
return {
  "customerId" : "38427357",
  "productName":[{
  "product":[{
    "name":"sample1",
    "status":"Active"
  },{
    "name":"sample2",
    "status":"Active"
  }]
  }]
};

}
});

In the above service class instead of returning the hardcoded json i should return RSVP promise along with this data.

Below is my controller file

index.js

import Ember from 'ember';

export default Ember.Controller.extend({

customer: Ember.inject.service(),

actions: {
searchCustomer: function() {
  this.store.push(this.store.normalize('customer', this.get('customer').getIndividualCustomer(this.get('inputID'))));
  this.transitionToRoute('customers.view', this.get('inputID'));
},
}
});

Below is my serializer file

customer.js

import ApplicationSerializer from './application';

export default ApplicationSerializer.extend({
 primaryKey: 'customerId'
});

3-Things to Resolve in the above code :

1) Have to return promise from the service along with data.

2) How to get the pushed data(Hope i pushed the data correctly).

3) While running above code i am getting the following exception,

Error: Ember Data Request GET /api/v1/customers returned a 404

It would be great if someone guide me to resolve these issues.

Answer 1

1) The first part of your question is fairly simple. In your service, you can do this:

import Ember from 'ember';

export default Ember.Service.extend({
  getIndividualCustomer(id) {
    return new Ember.RSVP.Promise(function(resolve) {
      resolve({ ...data...});
  })
}

2) In your controller action, you have pushed the data into the store. Therefore, once you transition to the customers.view route, you can retrieve the customer that is now in the store via the ID. In the customers.view route's model hook, do this:

import Ember from 'ember';

export default Ember.Route.extend({
  model(params) {
    return this.store.find('customer', params.id)
  }
})

Then in the controller you would have access to the customer that you retrieved in the route's model hook.

3) Is hard to resolve since none of the code that you laid out above (except the commented out code) should be making a request to the server. Also the 1 ajax request that you have (commented out) would not be making a request to /customers it would be going to /customers/:id. It is likely that somewhere else in a route, probably the customers route, you're making the request.