Question

我正在尝试使用Handlebars块助手创建一个动态输入选择器。以下代码在Handlebars教程网站[http://www.javascriptoo.com/handlebars-js]上运行时或插入普通html网页时有效。

<td>
<div id="placeHolder">testing</div>
    <script id="siteOptions" type="text/x-handlebars-template">
        <select>
       {{#each options}}
           {{this.key}}
           <option {{this.hidden}}>{{this.optName}}</option>
       {{/each}}
        </select>
    </script>
</td>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs /jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.rc.1/handlebars.min.js"></script>

<script type="text/javascript">
    var source = document.getElementById("siteOptions").innerHTML;
    var template = Handlebars.compile(source);
    var myData = {
        options: [
            { "hidden":"hidden","name": "Company" },
            { "hidden":"","optName": "Plant" },
            { "hidden":"","optName": "Area" },
            { "hidden":"","optName": "Machine" }
        ]
    };
    console.log("myData: "+myData.options[2].optName);
    console.log("myObj: "+ template(myData.options));
    document.getElementById("placeHolder").innerHTML = template(myData);

在Firefox和Chrome中，我最终都是空的

下面的两个console.log（）显示：

console.log("myData: "+myData.options[2].optName);// Area ,Proves data is there
console.log("myObj: "+ template(myData.options));//<select>[empty]</select>

什么可能阻止它在FF和Chrome中工作？

Express-Handlebars块助手不处理本地数据

0 个答案: