绘制“tree”

[100pah]

如果想绘制个“menu”（或者“tree”），比如：

<ul>
    <li><a href="#">Aberdeen</a></li>
    <li><a href="#">Ada</a></li>
    <li>
        <a href="#">Salzburg</a>
        <ul>
            <li><a href="#">Perch</a></li>
            <li><a href="#">D</a></li>
            <li>
                <a href="#">Delphi</a>
                <ul>
                    <li><a href="#">Ada</a></li>
                    <li><a href="#">Saarland</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

有什么好办法绘出？

例如，recursively 使用 target来绘制tree：

<script id="tpl" type="text/html">
    {{ target: some }}
        {{ use: menu(children=${menu}) }}
    {{ /target }}  

    {{ target: menu }}
        <ul>
            {{ for: ${children} as ${item} }}
            <li>
                <a href="#">${item.text}</a>
                {{ if: ${item.children} && ${item.children.length} }}
                    {{ use: menu(children=${item.children}) }}
                {{ /if }}
            </li>
            {{ /for }}
        </ul>
    {{ /target }}
</script>
<script id="self" type="text/javascript">
    etpl.config({
        commandOpen: '{{',
        commandClose: '}}'
    });
    etpl.compile($('#tpl').html());
    alert(
        etpl.render(
            'some', 
            {
                menu: [
                    { text: 'Aberdeen' },
                    { text: 'Ada' },
                    { 
                        text: 'Salzburg',
                        children: [
                            { text: 'Perch' },
                            { text: 'D' },
                            { 
                                text: 'Delphi',
                                children: [
                                    { text: 'Ada' },
                                    { text: 'Saarland' }
                                ]
                            }
                        ]
                    }
                ]
            }
        )
    );
</script>

当然，现在是不行的，compile时会 Maximum call stack size exceeded 支持这种事情容易么？ 或者，有什么别的方法？

[errorrik]

导致上面现象的原因是：

etpl的target，在生成render函数时，会判断其依赖是否ready（import的target，模板的master，以及use的target）

但是，use的使用其实是运行时依赖，也就是说，在生成render函数时，是无需关心use的target是否ready的。

所以，这是etpl的一个问题，会在2.1.0修复。2.1.0已经开发到尾声了，预计明天或后天publish

[errorrik]

@100pah

你可以先从master上把代码复制过去用。2.1.0功能开发已经完毕，并且通过测试。

我需要一些时间修改测试用例的形式以便于持续集成，明天能否发布未知。