How could a component get a async property?


Here is my code:

App.TopWeatherComponent = Em.Component.extend({
    info: function() {
        return $.getJSON('').then(function(data) {
            return data;

And the following is my component:


But when I see the page which there is a top-weather component, {{info}} represents the promise object instead of the data I want. So how could I get the correct data? I want the data returned by the success function in the then. If the code above is not the right way, then what is the right way? Thanks a lot


Have a look at the PromiseProxyMixin on the api pages.


Can this be applied to component as well? The url u gave to me is for controllers


It could be mixed into a plain Ember object, so if you wanted to use multiple promised objects in a component you could assign properties:

this.set('myObject', Em.ObjectProxy.extend(Em.PromiseProxyMixin).create({
    promise: $.getJSON('/some/remote/data.json')


(Note: Ember Data has a PromiseObject defined like this.)


Thank you so much, I’ll give it a shot