UnderscoreJS Uncaught TypeError: Cannot call method 'replace' of undefined
13,925
Solution 1
Rather than trying to cache the note template HTML when you define the method, do it when you initialize the view.
initialize : function() {
// ...
this.nodeTemplate = _.template($('#note-template').html());
}
It's highly likely that you're defining the View before the DOM (and thus the template) is loaded.
Solution 2
Another solution is move the tag script above of call view , like this (I'm using jade)
script#page-thumb(type='text/template')
.page-thumb-container.relative
.page-thumb
.image
figure
img(src='{{ image }}' , width='80px',height='60px' , data-id='{{ id }}')
span.title {{ title }}
.page-dragger.absolute
script(src='js/src/views/PageThumbView.js')
Comments
-
marcopolo almost 2 years
In my Backbone view I have:
noteTemplate: _.template($('#note-template').html()),
Which is throwing this error. The template is:
<script type="text/template" id="note-template"> <div class="reminder"> <div class="reminder-hover"> <div class="title"><%= title %></div> <div class="created">Created 3 days ago <span class="pull-right"> In 3 hours</span></div> </div> <span class="id" style="display: none;"><%= id %></span> </div> </script>
I am confused because this works in my console:
>> _.template($('#note-template').html());
function (n){return e.call(this,n,w)}
Here is the the full code:
App.Views.Index = Backbone.View.extend({ el: $("div.reminders"), todays : $("span.today"), tomorrows : $("span.tomorrow"), weeks : $("span.week"), all_times : $("span.all-time"), noteTemplate: _.template($('#note-template').html()), events: { "click .reminder" : "editNote", "click .newNote" : "newNote" }, initialize : function() { _.bindAll(this, 'render'); this.notes = this.options.notes; this.listenTo(this.model, 'change', this.render); }, render : function() { // Hide things related to editing a note this.$("[name=content]").hide().val(""); this.$("[name=title]").hide().val(""); this.$("save1").hide(); this.$("close1").hide(); // Fill in content this.$el.html( this.noteTemplate( this.model.toJSON() ) ); this.$todays.html( collection.getTodays.length ); this.$tomorrows.html( collection.getTomorrows.length ); this.$weeks.html( collection.getWeeks.length ); this.$all_times.html( collection.getAllTimes.length ); return this; }, editNote : function() { this.goTo("notes/"+this.model.id); }, newNote : function(){ this.goTo("newNote"); } });