Mengapa Saya Mendapat Ralat 'Pembolehubah Templat Underscore Tidak Ditakrifkan' dalam Backbone.js?

Pembolehubah Templat Underscore Tidak Ditakrifkan Ralat Selesai

Dalam Backbone.js, menggunakan templat Underscore untuk menjana HTML secara dinamik adalah perkara biasa, tetapi coretan kod awal mungkin menemui "pembolehubah tidak ditakrifkan "kesilapan. Artikel ini menerangkan sebab perkara ini berlaku dan cara menyelesaikannya.

Isunya

Pada masa lalu, templat Underscore boleh dihuraikan dan diisi dalam satu langkah menggunakan sintaks berikut:

var html = _.template(template_string, data);

Perubahan

Walau bagaimanapun, Underscore versi 1.7.0 dan ke atas memperkenalkan konsep pilihan templat, yang mesti disediakan secara eksplisit sebagai hujah kedua kepada _.template(). Pilihan ini membolehkan kawalan terperinci ke atas tingkah laku templat.

Penyelesaian

Untuk menyusun dan melaksanakan templat Underscore dengan betul, ikut langkah berikut:

1. Kompilasi templat menggunakan _.template(template_string).
2. Laksanakan fungsi yang dikembalikan dengan data untuk diisi templat.

Ini boleh diwakili sebagai:

var tmpl = _.template(template_string);
var html = tmpl(data);

Contoh

Pertimbangkan coretan kod berikut, yang menunjukkan cara melaksanakan templat dengan Airbnb 's Sewaan Percutian set data:

var V = Backbone.View.extend({
  el: 'body',
  render: function() {
    var data = [
      {
        id: 1,
        lat: -27,
        lon: 153
      },
      {
        id: 2,
        lat: -33,
        lon: 151
      }
    ];
    var tmpl = _.template('<li><%= id %>. <%= lat %>, <%= lon %></li>');
    var html = data.map(tmpl).join('');
    this.$el.html(html);
    return this;
  }
});

var v = new V();

v.render();

Dengan mengikut sintaks templat yang betul, anda boleh menggunakan templat Underscore dengan berkesan dalam aplikasi Backbone.js anda.

Atas ialah kandungan terperinci Mengapa Saya Mendapat Ralat 'Pembolehubah Templat Underscore Tidak Ditakrifkan' dalam Backbone.js?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!