Ember.js 'faker' is not defined

I'm trying to start a server from a repo but having issues getting it started because of the following error:

ember serve


Livereload server on http://localhost:49152
Serving on http://localhost:4200/

mirage/factories/page.js: line 4, col 42, 'faker' is not defined.

1 error

mirage/scenarios/default.js: line 7, col 19, 'domain' is defined but never used.
mirage/scenarios/default.js: line 13, col 105, Missing semicolon.
mirage/scenarios/default.js: line 5, col 7, 'ads' is defined but never used.

3 errors

===== 2 JSHint Errors

page.js:

import { Factory } from 'ember-cli-mirage';

export default Factory.extend({
    permalink: function() { return '/' + faker.lorem.words(1); }
});

What is wrong here? I also manually installed faker using npm but it doesn't seem to have any effect at all and I'm still stuck with this error.

Ember Component Configure Model

I may be approaching this incorrectly but I want to pass an array object in a component and build a map off of the data. For example if I had a book with a set of chapters and lines. The data coming in is defined as an object in the following way:

{
book: blah,
chapter: 1,
verse: 3
}

I want to take that array and display it this way:

Book

chapter

line1

line2

line3

Like I said maybe I'm approaching this wrong where the passed in object shouldn't be configured by the component before it's rendered but I have issues modifying the model within a promise to be rendered by the front end.

Is what I'm trying to do possible?

Auto Calculate Component in EmberJS

I'm trying to create a component in Ember that shows you how many comments a post has. I pull the comments from the API. The problem right now is, if there are new comments, it doesn't re-query the API.

Is there a way to have the Ember component automatically check every 15 or so seconds for new comments to update the count?

How to pass an object to link-to + queryParams in Ember?

I'm currently in a situation that I need to pass one object to , but queryParams does not accept objects {}. I need this feature because I'm using this component in different templates. The reason for doing that is that one template uses some keywords to use as a filter that the other template does not use and vice-versa.

I started using my own helper to generate the link, but I realize that the anchor my helper was generating was reloading the whole page and link-to does not do that. I'd like to reproduce that behavior.

Is there a smart way to create a link using objects now? I saw some answers but they were all related to ember 1.+ and canary. In all of the answers they were saying it was not possible. I wonder if people have implemented this now or if a solution for this problem is being used currently and I could not find...

Thanks!

Collecting text submitted in input field with ember-rails

I am following an ember-rails tutorial. It's using coffeescript and I'm writing in javascript. Essentially I have a form that when I submit text on it it should place the text below.

My controller looks like this:

Emberapp.ApplicationController = Ember.Controller.extend({

  entries: [],
  actions: {
    addEntry: function(){
      this.entries.pushObject name: this.get('newEntryName');
      this.set('newEntryName', "");
    }
  }
});

My template looks like this

<div id = "container">
  <h1>Emberails</h1>

  

  <ul>
    
      <li></li>
    
  </ul>

</div>

When I reload the page I get an error stating that 'name: this.get('newEntryName');' is an Unexpected identifier. I've been checking for the syntax rules online but I'm not sure if it is a coffeescript to javascript error or something else.

Ember.RSVP.Promise resolved value changes

So, I am trying to wrap a jQuery AJAX request in a Ember RSVP promise, and I have this issue where the value I send to the resolve function (which is the jqXHR parameter) changes from object to string.

The code for doing the request + creating the request is as follows:

return new Ember.RSVP.Promise(function(resolve, reject) {
  Ember.$.ajax([URL], {
    type: 'POST',
    dataType: 'text'
  }).then((data, textStatus, jqXHR) => {
    console.log(jqXHR);
    resolve(jqXHR);
  }, (jqXHR, textStatus, errorThrown) => {
    resolve(jqXHR);
  });
});

And in my controller, I handle the request like this:

promise.then((response) => {
  console.log(response);
  if (response.status === 200) {
    something...
  } else {
    something else...
  }
  receipt.set('busy', false);
});

Now, from the basic (and probably flawed) comprehension I have of RSVP.Promise, the resolve(jqXHR) line should send the jqXHR object as parameter to the callback, right?

Problem is, when I print the response I get in the console, all I get is 200 success, which is the body of the HTTP request I do.

However, when I print the jqXHR before resolving it, it correctly prints the whole object:

Object {readyState: 4, responseText: "200 success", status: 200, statusText: "OK"}

So why is this happening? Is Ember doing some wierd black magic and converts the jqXHR object to string? Or is the data string being sent in lieu of the jqXHR object I am expecting?

Thanks!

Filling out form using ember-rails gem

I'm following a tutorial that is about a year old so there is some syntax that has been depreciated. I type some text in an input field and hit enter. I should see an alert box pop up with the text I've just written. Instead, when I load the page and look at the console, I immediately get this error:

Uncaught SyntaxError: missing ) after argument list

It says I have an error in my controller but there doesn't seem to be any syntax problems in my code.

When I type and hit enter, there is no alert box and an error on the console says:

Uncaught Error: Nothing handled the action 'addEntry'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble.

My application template looks like this:

<div id = "container">
  <h1>Emberails</h1>

  

  

</div>

My ApplicationController looks like this:

Emberapp.ApplicationController << Ember.Controller.extend(
    addEntry: function(){
      alert(this.get('newEntryName'));
      this.set('newEntryName', "");
    }
)

Appreciate any help on this.