mercredi 13 septembre 2017

ember data findRecord return value is not the expected record

I am just starting with Ember and picking up javascript again after few years. Have a basic question.

I have a login page - with login route and controller. I have setup an ember cli mirage endpoint to return applicantsinfo data, when calling GET /applicantsinfo/123

import Ember from 'ember';

 export default Ember.Controller.extend({
   applicantsinfoRecord: '',
   userName: '',
   password: '',
actions: {
submitAuthForm() {
  const userName = this.get('userName');
  const password = this.get('password');

  // call to mirage 
  this.get('store')
    .findRecord('applicantsinfo', userName)
    .then((applicantsInfoRecord) => {
      this.set('applicantsInfoRecord', applicantsInfoRecord);
      console.log('inside then function',applicantsInfoRecord);  
      this.transitionToRoute('form-edit');
    })
    .then((error) => {
      console.log('then error happened', error);
      this.set('submissionMessage', 'then(error): There was an error logging in with userName:', userName);
    })
    .catch((error) => {
      console.log('inside catch', error);
      this.set('submissionMessage', 'catch(error): There was an error logging in with userName:', userName);
    });
}

} });

login.hbs is simple with username/password fields and submit button that calls the controller submitAuthForm() function

login.hbs

  <label>Card Number</label>
  


<label>Password</label>


<button class="primary-link" type="submit" >
  Submit
</button>  

my problem is when the findRecord call returns the value in the then() block, it gives me an ember class

ember inspector screenshot It should return me an actual applicantinfo record. that is returned by cli mirage

/app/mirage/config.js

this.get('/applicantsinfos/123', () => {
 return { applicantsinfo: { "id": 123, "sessionId": 3, "userName": 
 'Abc', "salary": '10110', "age": '1100', "password": 'password03' } }
 });

Basically I want to set this returned object applicantsinfo in controller property and then transition to the next page form-edit, where i will retrieve this property, using

this.controllerFor('login').get('applicantsinfo')

So essentially i have two questions, should i not get at that applicantsinfo record instead of ember _Class variable.

Also is this a correct approach to call for authentication first, if its successful, i will probably pass the sessionId from the return applicantsInfo record over to the next page, where in the route (in the model() function) , i can make another back-end call to pull additional customer profile based on the sessionId.

Please note that i am not asking how to write authentication functionality. This question can be generalized to a case - where first screen's controller makes a back-end call, retrieves a sessionId from the returned result, and then transitions to the next page, where the route for that page, makes another backend call based on the sessionId passed from previous page's controller.




Aucun commentaire:

Enregistrer un commentaire