如何编写可以遍历所有嵌套数据并在HTML中显示嵌套列表的可重用模板

<script id="nestedListTemplate" type="text/template">
  <ul>
    <% for (var i = 0; i < data.length; i++) { %>
      <li>
        <%= data[i].name %>
        <% if (data[i].children && data[i].children.length > 0) { %>
          <%- nestedListTemplate(data[i].children) %>
        <% } %>
      </li>
    <% } %>
  </ul>
</script>

// 获取模板内容
var template = document.getElementById('nestedListTemplate').innerHTML;

// 定义数据
var data = [
  {
    name: 'Item 1',
    children: [
      {
        name: 'Item 1.1',
        children: [
          {
            name: 'Item 1.1.1',
            children: []
          },
          {
            name: 'Item 1.1.2',
            children: []
          }
        ]
      },
      {
        name: 'Item 1.2',
        children: []
      }
    ]
  },
  {
    name: 'Item 2',
    children: []
  }
];

// 渲染模板
var renderedHTML = _.template(template)({ data: data });

// 将渲染后的 HTML 插入到页面中
document.getElementById('nestedListContainer').innerHTML = renderedHTML;