2013-03-11 76 views
0

下面的代碼似乎並沒有工作:Ember視圖不顯示?

//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>甚至沒有顯示在頁面上(雖然應用程序是)

+0

你使用哪種版本的Ember? – mavilein 2013-03-11 10:14:32

+0

哎呀,忘了包括:'v1.0.0-pre.4' – andy 2013-03-11 10:16:05

+1

我想你已經從舊版本的Ember遷移這個代碼,現在它停止工作?這是因爲您在那裏使用舊的路由器API。新的路由器API不能以這種方式工作... – mavilein 2013-03-11 10:25:33

回答

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: "/"