Ember View不显示?

时间:2013-03-11 10:12:17

标签: javascript ember.js

以下代码似乎不起作用:

//The HTML
<div class="content">
    <script type="text/x-handlebars" data-template-name="application">
      <h1>Application</h1>
      {{outlet}}
    </script>

    <script type="text/x-handlebars" data-template-name="user-list">
      <h2>Users</h2>
      <ul>
      {{#each App.userController}}
        <li>{{name}}</li>
      {{/each}}
      </ul>
    </script>
</div>

//The JS
var App = Ember.Application.create();

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

App.User = Ember.Object.extend({
    name: null,
    xs:0,
    turnover:0,
    surveys:0
});

App.UsersView = Ember.View.extend({
    templateName: 'user-list'
});

App.userController = Ember.ArrayController.create({
    content: [],

    init: function() {
        var me = this;

        $.getJSON('http://localhost:8000/', function(data) {

            me.set('content', []);

            $(data).each(function(index, value) {
                var t = App.User.create({
                    name: value.name,
                    xs: value.xs,
                    turnover: value.turnover,
                    surveys: value.surveys
                });

                me.pushObject(t);
            });
        });
    }
});

App.router = Ember.Router.create({
    enableLogging: true,

    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route:'/',
            connectOutlets:function(router) {
                return router.get('applicationController').connectOutlet({
                    viewClass: App.UsersView,
                    controller: App.userController
                });
            }
        }),
    })
});

App.initialize(App.router);

userController 正确获取数据。我认为这个问题与观点有关。 <h2>Users</h2>甚至没有显示在页面上(虽然应用程序是)

1 个答案:

答案 0 :(得分:0)

过去几个月,Ember版本之间的版本差异很难实现。我通常会折扣在1月之前发布的代码,除非我知道它没有受到重大变化的影响。

以下是RC1的一个示例,截至2013年3月12日: http://jsfiddle.net/nrionfx/Se2Bw/1/

(它在Coffeescript中 - 我主要编写Ruby并发现它更具可读性......)

App.UsersController = Em.ArrayController.extend
    title: 'users controller'
    content: []

App.UsersRoute = Em.Route.extend
    enter: ->
        console?.log('users route')
    setupController: (controller) ->
        #Do your AJAX call here and set the content array upon success
        ct= [
            App.User.create({id: 1, name: 'Bill', xs:0}),
            App.User.create({id: 2, name: 'Bob', xs:0}),
        ]
        controller.set('content', ct)
        #END AJAX

App.Router.map (match) ->
    @route "users", path: "/"