0

私が取り組んでいるプロジェクトでは、現在 Backbone.js を使用して Web サイトを作成しており、Handlebars (http://handlebarsjs.com/) をテンプレート システムとして使用しています。JSONドキュメントから対応するテンプレートに値を取得し、それを親ビューに返すサブビューを作成しようとしています。

私が遭遇している問題は、私が使用するときです

Handlebars.Compile(referenceViewTemplate)

templateを使用してトークンを置き換えようとすると、関数が認識されません

this.template({ identifier: value })

テンプレート コードは次のとおりです。

<div id="reference-template">
  <div class="id">{{id}}</div>
  <div class="reference">{{content}}</div>
</div>

バックボーン モデルは次のとおりです。

define(['underscore','backbone'], 
function(_, Backbone){
  var reference = Backbone.Model.extend({
     initialize: function(){}
  });
  return reference;
});

バックボーン コレクションのコードは次のとおりです。

define(['underscore','backbone','models/reference'], 
  function(_, Backbone, Reference){
  var References = Backbone.Collection.extend({
    model: Reference,
    parse:function(response){ return response; }
  });
  return new References;
});

参照ビューを呼び出す親ビューのコードは次のとおりです。

this.ref = new ReferenceView();
this.ref.model = this.model.page_refs; //page_refs is the section in the json which has the relevant content 
this.ref.render(section); //section is the specific part of the json which should be rendered in the view

ReferenceView のコードは次のとおりです。

define([
  // These are path alias that we configured in our bootstrap
  'jquery','underscore','backbone','handlebars',
  'models/reference','collections/references','text!templates/reference.html'],
  function($, _, Backbone, Handlebars, Reference, References, referenceViewTemplate) {
    var ReferenceView = Backbone.View.extend({

    //Define the default template
    template: Handlebars.Compiler(referenceViewTemplate),   

    el: ".overlay-references",

    model: new Reference,

    events:{},

    initialize : function() {
      this.model.bind('change', this.render, this);
      return this;
    },

    // Render function
    render : function(section) {
       //this is where it says "TypeError: this.template is not a function" 
       $(this.el).append(this.template(References.get(section).get("content")));
       return this;
    }
});

私はこれを読むことがたくさんあることを知っています.

4

1 に答える 1

0

答えは、html をコンパイルするために間違った関数を使用していたようです。何らかの理由で、Handlebars.Compiler代わりに入力しましたHandlebars.compile

これでプロジェクトのすべての問題が解決されたわけではありません (テンプレートは現在返されていますが、値が入力されていません) が、少なくとも一歩前進しています。

于 2012-11-20T16:03:20.840 に答える