backbone.js - Backbone Views でネストされた各ループにアンダースコアを付ける

Question

各 measureView のレンダリングとその子 (beatView(s)) を同じ measureView.js ファイルにネストしようとしています。パスの定義にはrequire.jsを使用しているため、未定義のvar名の一部はご容赦ください。問題は、ネストされた _.each メソッドのmeasuresView.jsにありnew BeatView()ますUncaught TypeError: undefined is not a function。new BeatView()最初の外部から手動で呼び出して_.each function、require.js BeatView 変数のスコープではないことを確認しようとしましたが、これを使用して同じエラーが発生しました: ( new BeatView({model:this.component.models[0].get('beats').models[0], el:this.el}); )。_.eachスコープでネストされた s を使用することに特別な何かがありますか、それとも他に欠けているものがありますか?

measureView.js : 完全なコードの jsfiddle

define([
  'jquery',
  'underscore',
  'backbone',
  'backbone/collections/beats',
  'backbone/collections/measures',
  'backbone/views/beats/beatView',
  'text!backbone/templates/measures/audioMeasures.html',
  'text!backbone/templates/measures/linearBarMeasures.html',
  'text!backbone/templates/measures/linearBarSVGMeasures.html',
  'text!backbone/templates/measures/circularPieMeasures.html',
  'app/dispatch',
  'app/state',
  'app/log'
], function($, _, Backbone, BeatsCollection, MeasuresCollection, BeatView, audioMeasuresTemplate, linearBarMeasuresTemplate, linearBarSVGMeasuresTemplate, circularPieMeasuresTemplate, dispatch, state, log){
  return Backbone.View.extend({
    el: $('.component'),

...

render: function(){
  //we create a measuresView for each measure.
  _.each(this.component.models, function(measure) {
    var compiledTemplate = _.template( this.representations[this.currentMeasureRepresentation], {measure: measure, measureAngle: 360.0 } );
    $(this.el).append( compiledTemplate );
       //we create a beatView for each beat in the measure.
        _.each(measure.get('beats').models, function(beat) {
          new BeatView({model:beat, el:this.el});
        }, this);
  }, this);
 return this;
},

BeatView.js : 完全なコードの jsfiddle

render: function(){
  var compiledTemplate = _.template(this.representations[this.currentBeatRepresentation], {beat: this.model, beatAngle: this.beatAngle});
  $(this.el).append(compiledTemplate);
  return this;
},

追加情報：

バックボーン構造:

Component (basically an instrument)
  ↳ A collection of Measure(s)
    ↳ Measure
      ↳ A collection of Beat(s)
        ↳ Beat

ビート モデル:

//filename: models/beat.js
/*
  This is the beat model.
  It only knows about whether or not it
  is selected.
*/
define([
  'underscore',
  'backbone'
], function(_, Backbone) {
  var beatModel = Backbone.Model.extend({
    defaults: {
      selected: false,
      state: 'OFF'
    },
    initialize: function(){
    },
    getStyleClass: function() {
      if (this.selected) {
        return 'ON';
      }
      else {
        return 'OFF';
      }
    }
  });
  return beatModel;
});

ビートコレクション:

//Filename: collections/beats.js
/*
  This is the beats collection.
  It is a collection of beat models.
*/
define([
  'jquery',
  'underscore',
  'backbone',
  'backbone/models/beat'
], function($, _, Backbone, beatModel){
  return Backbone.Collection.extend({
    model: beatModel,
    initialize: function(){
    }
  });
  //return new beatsCollection();
});

測定モデル:

//filename: models/measure.js
/*
  This is the measure model.
  A component has a collection of these models.
  these models have a collection of beats.
*/
define([
  'underscore',
  'backbone',
  'backbone/collections/beats'
], function(_, Backbone, beatsCollection) {
  var measureModel = Backbone.Model.extend({
    defaults: {
      label: '0/4',
      beats: beatsCollection,
      numberOfBeats: 0,
      divisions: 8
    },
    initialize: function(){     
    }
  });
  return measureModel;
});

メジャー コレクション :

//filename collections/measures.js
/*
  This is the measures collection.
  It is a collection of measure models.
*/
define([
  'jquery',
  'underscore',
  'backbone',
  'backbone/models/measure'
], function($, _, Backbone, measureModel){
  return Backbone.Collection.extend({
    model: measureModel,
    initialize: function(){
    }
  });
});

内部エラー:

Uncaught TypeError: undefined is not a function measuresView.js:100
(anonymous function) measuresView.js:100
_.each._.forEach underscore.js:78
(anonymous function) measuresView.js:96
_.each._.forEach underscore.js:78
Backbone.View.extend.render measuresView.js:88
Backbone.View.extend.initialize measuresView.js:72
Backbone.View backbone.js:1236
child backbone.js:1467
Backbone.View.extend.render componentView.js:63
Backbone.View.extend.initialize componentView.js:54
Backbone.View backbone.js:1236
child backbone.js:1467
(anonymous function) componentsView.js:201
_.each._.forEach underscore.js:78
Backbone.View.extend.render componentsView.js:192
Backbone.Router.extend.newSong router.js:42
(anonymous function) backbone.js:967
(anonymous function) backbone.js:1164
_.some._.any underscore.js:207
_.extend.loadUrl backbone.js:1162
_.extend.start backbone.js:1128
initialize router.js:157
initialize SOF.js:15
....

外部エラー:

Uncaught TypeError: undefined is not a function measuresView.js:86
Backbone.View.extend.render measuresView.js:86
Backbone.View.extend.initialize measuresView.js:72
Backbone.View backbone.js:1236
child backbone.js:1467
Backbone.View.extend.render componentView.js:63
Backbone.View.extend.initialize componentView.js:54
Backbone.View backbone.js:1236
child backbone.js:1467
(anonymous function) componentsView.js:201
_.each._.forEach underscore.js:78
Backbone.View.extend.render componentsView.js:192
Backbone.Router.extend.newSong router.js:42
(anonymous function) backbone.js:967
(anonymous function) backbone.js:1164
_.some._.any underscore.js:207
_.extend.loadUrl backbone.js:1162
_.extend.start backbone.js:1128
initialize router.js:157
initialize SOF.js:15
....