Basic code for creating a TemplateCollectionView

main.js

Pharos360.main = function main() {
  Pharos360.getPath('mainPage.mainPane').append();
  Pharos360.studentsController.set('content', Pharos360.store.find(Pharos360.Student));
};

function main() { Pharos360.main(); }

main_page.js

    ...

    detailView: SC.ScrollView.design({
        layout: { top: 10, bottom: 10, left: 251, right: 10 },

        hasHorizontalScroller: NO,
        backgroundColor: 'white',

        contentView: Pharos360.StudentsListView.design({
          layout: { top: 0, left: 0, right: 0, bottom: 0 }
        })
      })

     ...

students.js

Pharos360.studentsController = SC.ArrayController.create(
/** @scope Pharos360.studentsController.prototype */ {
  // TODO: Add your own code here.
}) ;

students_list.handlebars

{{#collection "Pharos360.StudentsListView"}}
  <div>{{bind "length"}}</div>
{{/collection}}

students_list.js

Pharos360.StudentsListView = SC.TemplateCollectionView.extend(
/** @scope Pharos360.StudentListView.prototype */ {
  templateName: 'students_list',
  contentBinding: 'Pharos360.studentsController'
});