Шаблон руля не может обрабатывать JSON из Backbone - PullRequest
3 голосов
/ 17 августа 2011

Handlebars не может прочитать объект JSON, который я отправляю, как контекст.

Вот функция, которая вызывает шаблон усов и дает ему контекст:

render: function() {
  var source = $("#round").html();
  var template = Handlebars.compile(source);
  var context = JSON.stringify(this.model);
  console.log(context);
  var html = template(context);
  $(this.el).html(html);
  return this;
},

Вот объект JSON, который я передаю ему:

{"result":0,"friend1":{"firstName":"Ape","lastName":"Head","fbID":329018,"kScore":99,"profilePic":""},"friend2":{"firstName":"Ape","lastName":"Hands","fbID":32,"kScore":70,"profilePic":""}}

Вот шаблон Handlebars:

  <script id="round" type="text/x-handlebars-template">
    {{#with friend1}}
    <h2>{{firstName}} {{lastName}}</h2>
    {{/with}}
  </script>

Я получаю следующую ошибку:

Uncaught TypeError: Cannot read property 'firstName' of undefined

Ответы [ 4 ]

10 голосов
/ 17 августа 2011

замените эту функцию:

render: function() {
  var source = $("#round").html();
  var template = Handlebars.compile(source);
  var context = JSON.stringify(this.model);
  console.log(context);
  var html = template(context);
  $(this.el).html(html);
  return this;
},

на:

render: function() {
  var source = $("#round").html();
  var template = Handlebars.compile(source);
  var context = JSON.parse(this.model.toJSON);
  console.log(context);
  var html = template(context);
  $(this.el).html(html);
  return this;
},

template в этом случае должен принимать объект javascript.JSON.stringify возвращает строковое представление объекта JSON, а не объекта javascript.Но то, что вы действительно хотите, это атрибуты модели.Таким образом, вы можете получить к ним доступ через toJSON или JSON.stringify (this.model), но затем вам нужно преобразовать их обратно в объект Javascript.

2 голосов
/ 04 января 2013

Просто используйте .toJSON() в вызове шаблона, который преобразует атрибуты модели в объект json, ожидаемый рулем:

template(this.model.toJSON());
1 голос
/ 28 августа 2012

Я бы согласился с ответом Дэна за самый быстрый способ сделать это. В случае списка, где вам может понадобиться идентификатор для захвата кликов, вы можете даже сделать это

<script id="round" type="text/x-handlebars-template">
{{#each friends}}
<li id="{{ this.id }}" >{{this.attributes.firstName}} {{this.attributes.lastName}}</li>
{{/each}}
</script>
1 голос
/ 20 декабря 2011

Try:

var html = template(this.attributes);

Свойство attributes объекта модели Backbone содержит представление данных объекта JS.Не очень удобно обращаться к нему напрямую, но в этом случае это может быть проще, чем пытаться обойти данные через JSON.

...