Using JSON Api URL EmberJS

Question

I normally get data from a service I created, a hard-coded JSON. But I need to take the JSON from an URL.

This is my twiddle :

https://ember-twiddle.com/b9cd8b1b3418d876f88235c4aa99e268?openFiles=templates.pic.hbs%2Ctemplates.components.image-list.hbs14

How can I add a URL as a source instead of calling it from the service 'pics'? I tried something but got errors and couldn't do anything. I'm very new at this.

I tried

model() {
   return $.getJSON('/my-url');
}

But I get this error :

Mirage: Your Ember app tried to GET 'my URL', but there was no route defined to handle this request. Define a route that matches this path in your mirage/config.js file. Did you forget to add your namespace?

I totally had no idea about the error because I don't use mirage, I created it yeah but didn't use in any part of the project.

Then I tried :

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        this.get('my Json url', () => {
            return [];
        });
    }
});

Now chrome's devTool doesn't give any error but all I see is a blank-page. Is this all wrong or is it something about the .hbs files?

Any ideas?Thanks!

It sounds like you have ember-cli-mirage in your project dependencies. — locks
– locks, Commented Jun 2, 2016 at 16:50
Yes, I deleted it from npm-modules folder and packages.js. But I still see nothing but a blank page, with no errors at all. So I'm stucked. ember-twiddle.com/… Maybe you can see what is wrong in the new twiddle? — hbc
– hbc, Commented Jun 3, 2016 at 7:55

Daniel · Accepted Answer · 2016-06-02 18:49:02Z

1

Uninstall ember-cli-mirage and go back to:

model() {
   return $.getJSON('/my-url');
}

answered Jun 2, 2016 at 18:49

Daniel

18.7k8 gold badges69 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

hbc Over a year ago

Thanks, I did that but still all I see is a blank page with no errors. Is it about my .hbs file? I can't figure out why. I used service before, now maybe I need to change somethin else? Can you please check my new twiddle, you can see it is all blank here. ember-twiddle.com/…

Daniel Over a year ago

I see 4 errors in console - first, Ember Twiddle uses HTTPS protocol and you try to load HTTP page - which raises Mixed Content error, so request from getJSON fails, then index route model raises an error because of that. You have to either try it locally instead of Ember Twiddle or you have to request HTTPS page instead of HTTP from Ember Twiddle.

hbc Over a year ago

I changed http:// to https:// but still nothing.. I must be missing something. How about my model list.js and .hbs files? do they seem okay?

Daniel Over a year ago

You can't simply change protocols. I've tried your API page with HTTPS and it errored. It doesn't have HTTPS protocol available so it will still give you error. Look - this page won't load (there's no HTTPS for it): api.donanimhaber.com/api/v1/site/…

hbc Over a year ago

this is not a page I created so I can't do anything on it, so are you saying there would be no problem if it was an https:// ? If so i I will talk to back-end guys and want them to do something. Or is there anything else I can do?

|

hbc · Accepted Answer · 2016-06-03 09:49:56Z

0

I figured what the problem was with some help :

Solution:

In my index.js, I should have used

{{image-list model=model.Data currentPos=currentPos }}

instead of

{{image-list model=model currentPos=currentPos }}

Also, I don't need any model/*.js because I get the model() from IndexRoute so I deleted those files. Thanks

answered Jun 3, 2016 at 9:49

hbc

439 bronze badges

Collectives™ on Stack Overflow

Using JSON Api URL EmberJS

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related