<div id="form-container">
    <h4>Fruits and Vegetables</h4>
    <ul>
        <oj-bind-for-each data="[[categories]]">
            <template data-oj-as="category">
                <li>
                    <oj-bind-text value="[[category.data.name]]"></oj-bind-text>
                    <ul>
                        <oj-bind-for-each data="[[categories.getChildDataProvider(category.data.name)]]">
                            <template data-oj-as="item">
                                <li>
                                    <oj-bind-text
                                        value="[[item.data.name]]">
                                    </oj-bind-text>
                                </li>
                            </template>
                        </oj-bind-for-each>
                    </ul>
                </li>
            </template>
        </oj-bind-for-each>
    </ul>
</div>