Question

我想用grunt-assemble静态网站生成，一切正常，但我有一个问题，让数组成为部分

这是我的部分（image-slider.hbs）应该重现数组

<div class="swiper-container {{className}}">
    <div class="swiper-wrapper">
        {{#each images}}
            <img  class="swiper-slide" src="{{ ../path }}/{{image}}" alt="">
        {{/each}}
    </div>
</div>

从这部分（office-slider.hbs）我想发送数据

... 
<h1>images from the office</h1>
{{> image-slider 
    className='office-slider' 
    path='..img' 
    images=[
        "image": "t_1.jpg",
        "image": "t_2.jpg",
        "image": "t_3.jpg",
        "image": "t_1.jpg",
        "image": "t_2.jpg",
        "image": "t_3.jpg",
    ]
}}
...

office-slider.hbs包含在office.hbs

中

...
{{>office-slider}}
...

＆＃34;的className＆＃34;和＆＃34;路径＆＃34;工作正常，但如果我尝试将数组作为数据我只得到一个错误

警告：意外的令牌ILLEGAL使用--force继续。因警告而中止。

我做错了什么？

gregor

Answer 1

根据@dandavis的建议，我将我的数据从模板中分离出来，这就是它的工作原理

我的gruntfile

assemble: {
    options: {
        partials: ['partials/**/*.hbs'],
        layoutdir: 'layouts',
        layout: ['default.hbs'],
        flatten: true,
        data: ['pages/**/*.json'],  <--load all jsons (contains the data)
        helpers: ['js/helper-*.js']
    },
    site: {
        src: ['pages/**/*.hbs'],
        dest: 'build/pages/'
    }
}

创建home.json（在我的情况下，它位于home.hbs旁边的“pages / home /”目录中）

{
    "title": "pagetitle",
    "gallery1": ["item1.jpg", "item2.jpg","item3.jpg"] 
}

在我的home.hbs中，我使用home.json

中的数据加载部分

{{home.title}}
{{>image_bar data=home.gallery1}}

现在我可以完全访问部分（image_bar.hbs）

中的数据

<ul>
    {{#each data}} 
        <li><img  src="../img/{{this}}"></li > 
    {{/each}} 
</ul>

使用把手进行grunt-assemble：如何将数组转换为部分数组？

1 个答案: