Question

我有一个用yaml编写的文件，我想用中间人使用erb渲染。如何呈现此项以便将yaml文件转换为HTML。我后来想用CSS来设置它。我没有找到任何关于如何在任何地方在线完成这项基本任务的信息。

例如说我有yaml文件：

main_title: 'Ruby Operators'

sections:
  - section_title: 'Arithmetic'
    items:
      - title: '[ + ] Addition: '
        value: 'Adds values on either side of the operator'
      - title: '[ − ] Subtraction: '
        value: 'Subtracts right hand operand from left hand operand'
      - title: '[ * ] Multiplication: '
        value: 'Multiplies values on either side of the operator.'

  - section_title: 'Comparison'
    items:
      - title: '[ == ]'
        value: 'Checks if the value of two operands are equal or not, if yes then condition becomes true.'
      - title: '[ != ]'
        value: 'Checks if the value of two operands are equal or not, if values are not equal then condition becomes true.'

我想在html

中渲染这样的东西

<!DOCTYPE html>
<html>

<head>
    <title>Beautifyconverter.com Yaml To HTML Converter</title>
</head>

<body>
    <table>
        <tr>
            <td>main_title</td>
            <td>sections.0.section_title</td>
            <td>sections.0.items.0.title</td>
            <td>sections.0.items.0.value</td>
            <td>sections.0.items.1.title</td>
            <td>sections.0.items.1.value</td>
            <td>sections.0.items.2.title</td>
            <td>sections.0.items.2.value</td>
            <td>sections.1.section_title</td>
            <td>sections.1.items.0.title</td>
            <td>sections.1.items.0.value</td>
            <td>sections.1.items.1.title</td>
            <td>sections.1.items.1.value</td>
        </tr>
        <tr>
            <td>Ruby Operators</td>
            <td>Arithmetic</td>
            <td>[ + ] Addition: </td>
            <td>Adds values on either side of the operator</td>
            <td>[ − ] Subtraction: </td>
            <td>Subtracts right hand operand from left hand operand</td>
            <td>[ * ] Multiplication: </td>
            <td>Multiplies values on either side of the operator.</td>
            <td>Comparison</td>
            <td>[ == ]</td>
            <td>"Checks if the value of two operands are equal or not</td>
            <td> if yes then condition becomes true."</td>
            <td>[ != ]</td>
            <td>"Checks if the value of two operands are equal or not</td>
            <td> if values are not equal then condition becomes true."</td>
        </tr>
        <tr>
            <td></td>
        </tr>
    </table>
</body>

</html>

Answer 1

我严格限制此答案以访问YAML文件中的数据。这将为您提供您所追求的数据输出，您可以决定如何从那里设置样式。

假设您的文件名为mydata.yaml且位于您的Middleman应用的/data文件夹中，以下代码将用于生成您正在寻找的嵌套数据循环：

<h1><%= data.mydata.main_title %></h1>

<% data.mydata.sections.each do |section| %>
    <h2><%= section.section_title %><h2>
    <% section.items.each do |item| %>
        <h3><%= item.title %></h3>
        <h4><%= item.value %></h4>
    <% end %>
<% end %>

如何使用erb在中间人中呈现YAML文件

1 个答案: