温泉 UI - 没有 Angular JS 的可重复使用 HTML 片段？

Question

我正在玩 Onsen UI，想知道在没有 [=27] 的情况下使用 Onsen UI 时是否有办法定义和包含 HTML 的片段=] JS?

例如，假设我有两个页面：

<ons-template id="page1.html">
    <ons-page>
        <ons-toolbar>
            <ons-toolbar-button onclick="menu.toggleMenu()"><ons-icon icon="fa-bars"></ons-icon></ons-toolbar-button>
            <div class="center">Page 1</div>
        </ons-toolbar>
        <p>Page 1 content</p>
    </ons-page>
</ons-template>

<ons-template id="page2.html">
    <ons-page>
        <ons-toolbar>
            <ons-toolbar-button onclick="menu.toggleMenu()"><ons-icon icon="fa-bars"></ons-icon></ons-toolbar-button>
            <div class="center">Page 2</div>
        </ons-toolbar>
        <p>Page 2 content</p>
    </ons-page>
</ons-template>

<ons-toolbar-button>的定义在两个页面都是重复的，那么有没有一种机制可以定义代码片段并多次注入？

<ons-toolbar-button onclick="menu.toggleMenu()"><ons-icon icon="fa-bars"></ons-icon></ons-toolbar-button>

我知道使用 Angular 这可以使用 ngInclude 指令来完成，但想知道 <ons-template> 是否可以以某种方式用于执行此操作而不需要去 Angular?

Answer 1

温泉 UI 1.x 是基于 Angular 的，所以不使用它很难执行任何操作。

您要查找的是 Onsen UI 2，它基于 Web Components。这意味着它完全不可知（独立于平台）并且可以与任何其他框架结合使用。实际上它处于 alpha 版本，但它已经相当稳定，预计很快就会有 beta 版本。

如果你想看温泉UI 2.0你可以：

查看 Onsen UI GitHub Repository 上的最新版本。
遵循快速入门程序：

Quickstart
$ git clone http://github.com/OnsenUI/onsenui2-quickstart
$ cd onsenui2-quickstart
$ npm install && gulp serve

温泉 UI - 没有 Angular JS 的可重复使用 HTML 片段？

Onsen UI - reusable HTML fragments without Angular JS?

onsen-ui