顯示來自ArrayController的HTML

Question

我試圖從我的控制器顯示一些信息到我的視圖中，但信息沒有顯示。

我有一個小提琴證明到目前爲止我的代碼：

Fiddle

如果我在控制檯MovieTracker.movi​​eController.content檢查，2個對象都顯示出來。但是，HTML沒有正確顯示。可能是什麼問題呢？

這是我的觀點：

<script type="text/x-handlebars"> 
{{#each MovieTracker.movieController}} 
    <h2>{{title}}</h2> 
    <h3>{{rating}}</h3> 
{{/each}} 

我的灰燼應用+控制器：

// Create our Application 
MovieTracker = Ember.Application.create(); 

// Inherit outlet Support 
MovieTracker.ApplicationController = Ember.Controller.extend(); 

// ArrayController to create some new Movies 
MovieTracker.movieController = Ember.ArrayController.create({ 
content: [], 
init: function(){ 
    var kidsMovie = MovieTracker.Movie.create({ 
     title: 'Toy Story', 
     rating: 4 
    }); 
    this.pushObject(kidsMovie); 

    var avengers = MovieTracker.Movie.create({ 
     title: 'The Avengers', 
     rating: 5 
    }); 
    this.pushObject(avengers); 
} 
}); 

// Start our Ember Application 
MovieTracker.initialize();​ 

Answer 1

我已經更新了你的小提琴（在這裏看到：http://jsfiddle.net/schawaska/hKPQy/24/）有「電影」視圖綁定到您的控制器實例，並且還添加了一個內容屬性綁定到控制器內容。還添加了對最新版本的ember和handlebars的引用。

現在你有一對夫婦的模板：

<script type="text/x-handlebars" data-template-name="application"> 
    <h1>Movie Tracker</h1> 
    {{view MovieTracker.MovieTrackerView }} 
</script> 

<script type="text/x-handlebars" data-template-name="movie-tracker"> 
    Movies:<br /> 
    {{#each movie in content}} 
     <h2>{{movie.title}}</h2> 
     <h3>{{movie.rating}}</h3> 
    {{/each}} 
</script> 

現在你each助手將通過一個集合中的每個值分配給movie，這是你的模型（即失蹤過於重複，所以我創建了一個）及其屬性。

你的控制器和視圖是這樣的：

MovieTracker.moviesController = Ember.ArrayController.create({ 
    content: [], 
    init: function(){ 
     // you missed the call to _super() 
     this._super(); 

     var list = [ 
      MovieTracker.MovieModel.create({ 
       title: 'Toy Story', 
       rating: 4 
      }), 
      MovieTracker.MovieModel.create({ 
       title: 'The Avengers', 
       rating: 5 
      })]; 

     // also, it's a good idea to use .set whenever you can 
     this.set('content', list); 
    } 
}); 

MovieTracker.MovieTrackerView = Em.View.extend({ 
    templateName: 'movie-tracker', 
    controllerBinding: 'MovieTracker.moviesController', 
    contentBinding: 'controller.content' 
});