Question

我在把手和html表方面遇到了一些问题：

{ 
  weekdays: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] 

}

            <table>
                <thead>
                    <tr>
                        {{#each weekdays}}
                        <th>{{this}}</th>
                        {{/each}}
                    </tr>        
                </thead>
                <tbody>
                    <tr>
                    <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td>
                    </tr>
                </tbody>
            </table>

此代码适用于tryhandlebars。

使用模板时，它可以正常使用list和plain，但是当我尝试使用表标题和数据时，它只显示：[object Object]。代码已开启：jsfidde

Answer 1

问题是您正在尝试使用html生成模板，但是胡子语句可以生成浏览器尝试更正的无效html。

如果你看一下传递给车把的html，你会得到这个：

                    {{#each weekdays}}

                    {{/each}}
                <table>
            <thead>
                <tr>
                    <!-- displays [object Object] with <template> tag --><th>{{this}}</th></tr>        
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                </tr>
            </tbody>
        </table>

script标记的内容未以相同方式解析，因此您没有损坏的模板。

通常我建议你使用预编译的模板，而不是将它们内嵌到你的html中，但是如果你在html中内嵌它们，你需要使用script标签。

Answer 2

这是因为您只是转储单个工作日对象，而不是命名属性。

你想改变这个：

                        {{#each days}}
                        <td>{{this}}</td>
                        {{/each}}

这样的事情：

                        {{#each days}}
                        <td>{{this.dayName}}</td>
                        {{/each}}

或对象上的任何属性名称。

Handlebars.js和HTML表格显示[object Object]而不是值

2 个答案: