带灯箱的聚合物单页应用程序

Question

关于 this 问题，我已经稍微改变了我的聚合物水疗中心以动态加载内容。
接下来是添加一个灯箱画廊。
我找到了一个非常轻量级的版本here
作为独立的，它工作得很好，但在我的动态内容页面中，我无法完成这项工作。
我创建了一个 git repo here

非常感谢。
维多利亚

ps：接下来是一个联系表单，一些不错的效果，比如 wow.js、语言选择器和图标字体

Answer 1

如果您只打算在页面上放置像自定义元素这样的静态内容，那么我认为不需要使用内容数组。所以我会改变你的 final.html

     <div layout horizontal center-center fit>
      <core-animated-pages id="pages" selected="{{route}}" valueattr="hash"
                           transitions="slide-from-right">
          <section hash="about" layout vertical center-center>
            <about-us></about-us>
          </section>
      </core-animated-pages>
    </div>

那么您有 1 个页面可以使用 http://address.com/#about 访问

要添加另一个页面，您需要做的就是添加另一个<section>，并带有您想要的路由的哈希属性。

我将假设您正在学习的教程使用自动绑定模板，并且在 javascript 中已等待该模板被绑定。或者您正在自定义元素中工作。

要设置默认路由，您可以将 javascript 中的路由行更改为类似

this.route = this.route || 'Single';

将'Single' 更改为您想要的默认页面。

希望有帮助。

请注意，我还删除了 on-tap 功能，因为我只看到它对那个演示有用。