Uncaught ReferenceError с использованием шаблона подчеркивания с основой

Question

Я пытаюсь отобразить HTML-код с помощью функции шаблона подчеркивания. Проблема в том, что я получаю Uncaught ReferenceError: data is not defined, когда загружаю скрипт локально на своей машине.

Кажется, что работает на jsfiddle, но не в моей среде, и я понятия не имею, почему. Вот working js fiddle.

и вот мой код:

define([ 
    'jquery', 
    'backbone', 
    'underscore', 
    'moment', 
    'bootstrap-modal', 
    'domReady!' 
], function (
    $, 
    Backbone, 
    _, 
    moment 
) { 

'use strict'; 

/** 
* Represents a booking modal view 
*/ 
return Backbone.View.extend({ 

    defaults: { 

     modalHeadingHtml: '<div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> <h4 class="modal-title"><%= data.title %></h4> </div>', 
     modalBodyHtml: null, 
     modalFooterHtml: null 

    }, 

    template: _.template('<div class="modal-dialog"><div class="modal-content"><%= data.content %></div></div>'), 

    className: 'wl-car-book-modal modal wl-modal fade', 

    /** 
    * Initializes booking modal view. 
    */ 
    initialize: function (options) { 

     this.options = _.extend({}, this.defaults, this.options); 

     $('body').append(this.render().el); 

     this.$el.modal() 

     var data = {data: { title: 'fooo'}}; 
     var tpl = _.template(this.options.modalHeadingHtml); 

     this.$('.modal-content').append(tpl(data)); 

     this.open(); 

    }, 

    render: function() { 


     var wrapperHtml = this.template({data: {content: 'test'}}); 

     this.$el.html(wrapperHtml); 

     return this; 

    }, 

    open: function() { 
     this.$el.modal('show'); 
    }, 

    close: function() { 
     this.$el.modal('hide'); 
    } 

}); 
}); 

Да, есть некоторые различия, но в основном это просто о кажущейся неопределенной переменной в функции инициализации.

Любая помощь была бы принята с благодарностью, спасибо.

Answer 1

Мое предположение, что modal() в этом. $ El.modal() - это то, что не определено. Проверьте блок define ([]). Каков полный путь для «bootstrap-modal»? Что вы видите в инструментах Chrome dev на вкладке «Источники»? Требуется загрузка bootstrap.js для 'bootstrap-modal'? Вероятно, он работает в jsfiddle, потому что modal() определяется каким-то другим способом включения bootstrap.js. это. $ el.modal() также может использовать точку с запятой в конце строки, но это не значит, что она не работает.