Handlebars.js пропускает данные JSON - PullRequest
Новая
       23

Handlebars.js пропускает данные JSON

1 голос
/ 26 марта 2012

У меня есть файл шаблона, загруженный Require.js через это:

main-app.js 

define([
        'backboneLoader',
        'handlebars',
        'text!templates/main.html',
        'text!appdata.json'
    ],
    function(
        Backbone,
        Handlebars,
        MainTemplate,
        AppData
    ) {
        "use strict";

        return Backbone.View.extend({
            initialize : function() {
                this.render();
            },

            render : function() {
                var template = Handlebars.compile(MainTemplate);
                var output = template(AppData);
                this.$el.append(output);
                console.log("appData:\n" + AppData);
                console.log("MainTemplate:\n" + MainTemplate);
                console.log("Output:\n" + output);
                    //smth extra
                return this;
            }
        });
    }
);

MainTemplate (main.html) 

<ul>
    <li><b>Version:</b> {{version}}</li>
    <li><b>Author:</b> {{author}}</li>
</ul>

AppData (appdata.json) 

{version: "0.0.1", author: "John Doe"}

И вывод: 

<ul>
     <li><b>Version:</b></li>
     <li><b>Author:</b></li>
</ul>

Пока ожидаемый результат: 

<ul>
        <li><b>Version:</b> 0.0.1</li>
        <li><b>Author:</b> John Doe</li>
</ul>

Есть идеи, что я делаю не так?Спасибо!

UPD: Проблема решена.Вот обновленный main-app.js: 

define([
        'backboneLoader',
        'handlebars',
        'text!templates/main.html!strip',
        'text!appdata.json'
    ],
    function(
        Backbone,
        Handlebars,
        mainTemplate,
        appData
    ) {
        "use strict";

        return Backbone.View.extend({
            initialize : function() {
                this.render();
            },

            render : function() {
                var template = Handlebars.compile(mainTemplate);
                var output = template(eval("(" + appData + ")")); //Object is expected by template(), not JSON.
                this.$el.append(output);
                console.log("appData:\n" + appData);
                console.log("template:\n" + mainTemplate);
                console.log("Output:\n" + output);
                    //smth extra
                return this;
            }
        });
    }
);

Ответы [ 2 ]

1 голос
/ 01 августа 2012

Проблема в AppData - это строка JSON, а не фактический объект.Просто измените:

var output = template(AppData);

на

var output = template(JSON.parse(AppData));

Возможно, вам придется включить json2.js добавить поддержку JSON для старых браузеров (<= IE7). </p>

0 голосов
/ 26 марта 2012

Вот jsFiddle repro вашей функции шаблона, преобразования шаблона, кажется, работают, проблема, вероятно, находится в тексте!Функция в коде require.js, попробуйте отладить текст!function.

Попробуйте также добавить функцию! strip при загрузке шаблона: 'text! templates / main.html! strip',

Документация предлагает это: For HTML/XML/SVG files, there is another option. You can pass !strip, which strips XML declarations so that external SVG and XML documents can be added to a document without worry.

...