无法在Ember.js中加载外部JSON [英] Can't load external JSON in Ember.js

问题描述

我是Ember的新手，我从URL中加载JSON时遇到了问题。这是我有的：

I'm new to Ember and I'm having a problem loading JSON from a URL. Here's what I have:

var App = Ember.Application.create();

App.ApplicationController = Ember.Controller.extend();
App.ApplicationView = Ember.View.extend({ templateName: 'application' });

App.OrdersListController = Ember.Controller.extend();
App.OrdersListView = Ember.View.extend({ templateName: 'orders' });

App.Order = Ember.Object.extend();
App.Order.reopenClass({
  find: function(){
     //not implemented yet 
  },
  findAll: function(){
      var content = [];
      $.ajax({
      url: 'http://api.domain/orders',
      dataType: 'jsonp',
      success: function(response){
        response.data.forEach(function(order){
          this.content.addObject(App.Order.create(order))
        }, this)
      }
    });
    return this.content;
  }
});

App.Router = Ember.Router.extend({
  enableLogging: true,
   // The initial state for the router, contains every other.
  root: Ember.Route.extend({
    goOrders: Ember.Route.transitionTo('orders'),
    goLocations: Ember.Route.transitionTo('locations'),
    goReports: Ember.Route.transitionTo('reports'),
    goUsers: Ember.Route.transitionTo('users'),
    goHelp: Ember.Route.transitionTo('help'),
    //Authenticated routes
    index: Ember.Route.extend({
        route: '/',
        redirectsTo: 'orders'
      }),
    orders: Ember.Route.extend({
      route:'/orders',
      initialState: 'index',
      //Orders view.
      index: Ember.Route.extend({
        route: '/',
        connectOutlets: function(router) {
          router.get('applicationController').connectOutlet({
            name:'ordersList', 
            context: App.Order.findAll()
          });
        }
      })
    })
  })
});

App.initialize();

在我的模板（简化）中：

And in my template (simplified):

<script type="text/x-handlebars" data-template-name="application">
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="orders">
    {{#each order in controller.content}}
<p>id: {{order.ord_id}}</p>
    {{/each}}
</script>

有了这个我没有得到和错误，但没有显示。如果我在连接Outlet的上下文中粘贴他的JSON，它可以工作。我的findAll（）函数有问题吗？

With this I don't get and error but nothing shows up. If I paste he JSON in the context of the connectOutlet it works though. Is there a problem with my findAll() function?

推荐答案

我会尝试这个：

findAll: function(){
      var content = [];
      $.ajax({
      url: 'http://api.domain/orders',
      dataType: 'jsonp',
      success: function(response){
        response.data.forEach(function(order){
          content.addObject(App.Order.create(order))
        }, this)
      }
    });
    return content;
  }

如你所见，我刚刚删除了这个指针两次。我认为在这种情况下，这个指针指向一个没有content属性的Order类。但是你想引用你定义的var。因此，应该没有这个。

As you see, i just removed the this pointer two times. I think the this pointer in this case points to an the Order class, which does not have a content property. But you want to reference the var you defined. Therefore it should be without this.

注意：在获取数据时，我也不时用这个指针来解决问题。但这种结构一直对我来说是至关重要的。所以它应该有效，但我的解释可能不完美。

这篇关于无法在Ember.js中加载外部JSON的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！