1

昨天我决定参加Middleman和HAML，他们太棒了！因为我不想只为一个值创建多个布局，所以我尝试使用frontmatter 变量来更改布局页面底部的javascript 片段中的值。

javascript 片段包含在:javascript过滤器中（这里是参考），它触发了一个 jQuery 插件。该插件需要一些变量。我想在其他页面中更改的变量是top. 根据 Middleman frontmatter 指南页面（这里是参考），您只需<% current_page.data.top %>在布局页面中添加您想要该变量的位置。这个用erb编写的字符串被翻译成haml in= current_page.data.top但是当我在浏览器中运行页面时，开发者控制台会告诉SyntaxError: expected expression, got '='.

如何成功地将中间人 frontmatter 变量集成到用 haml 编写的布局页面中的 javascript 片段中？

布局页面的底部（代码片段所在的位置）如下所示：

/ content of the layout the page

:javascript
    $('#sidenav').simplerSidebar({
        opener: '#toggle-sidenav',
        top: = current_page.data.top
        animation: {
            easing: 'easeOutQuint'
        },
        sidebar: {
            align: 'right',
            width: 320,
            closingLinks: 'a',
            css: {
                zIndex: 3000
            }
        }
    });

我要更改的页面如下所示：

---
top: 30
---

/ rest of the page
4

1 回答 1

1

我设法自己回答了我的问题。我再次更仔细地阅读了Haml 参考，在过滤器部分我读到“过滤器可以使用 #{} 插入 Ruby 代码”。.

基本上，在过滤器下编码时（无论它是什么过滤器），而不是使用 Middleman 和 Haml 提供的字符串，您应该使用这个#{current_page.data}.

在我的情况下，代码段应该是：

:javascript
    $('#sidenav').simplerSidebar({
        opener: '#toggle-sidenav',
        top: #{current_page.data.top},
        animation: {
            easing: 'easeOutQuint'
        },
        sidebar: {
            align: 'right',
            width: 320,
            closingLinks: 'a',
            css: {
                zIndex: 3000
            }
        }
    });
于 2016-01-23T22:36:07.047 回答