如何在 ionic 2 中创建自定义加载页面
Posted
技术标签:
【中文标题】如何在 ionic 2 中创建自定义加载页面【英文标题】：How to Create a Custom Loading page in ionic 2 【发布时间】：2016-12-16 09:24:55 【问题描述】：Ionic 2 默认加载页面是 src/index.html。我想用工作 app.component.ts 将它更改为我自己的 custom.html。正如我已经尝试通过将 content-src 标记更改为 config.xml 文件中的自定义 .html 文件来实现的那样。但是当我这样做时，app.component.ts 中的任何函数都不会执行，换句话说，控制根本不会进入其中。我不想尝试这个http://www.joshmorony.com/how-to-create-a-custom-loading-component-in-ionic-2/，因为这不适用于 ionic 2。
所以请建议我如何将我的默认加载页面（即 index.html）更改为自定义页面。
【问题讨论】：
你需要什么输出。到目前为止，您尝试过的需要一些代码 应用的起始页默认为index.html。但在我的情况下，我希望起始页面是 channel.html。当我将预先编写的网站代码转换为 ios 应用程序时，许多依赖项已经设置为 channel.html。所以我想 channel.html 出现在应用程序加载而不是 index.html ... 【参考方案1】：我认为最简单的解决方案是将custom.html 的内容放在index.html 的<my-app></my-app> 标记之间。此处定义的内容只会在组件<my-app> 加载后才会显示。
这是我自己用的一个例子
index.html
<body>
<my-app>
<!-- loading page-->
<div class="row" style="background-color: black; text-align: center;">
<img src="images/loading.gif" style="width: auto; height: 100%;"/>
</div>
</my-app>
</body>
这将在黑色背景上全屏显示我的loading.gif。
（内嵌样式，因此我不必在样式表中添加）。
结果：
【讨论】：
感谢您的回复。但是我有一些已经使用 custom.html 的 javascript 和其他代码依赖项......对于我未来的项目增强，只有当我有我的 custom.html 时才好......所以我想在页面加载时加载它...... .有什么选择吗？？ 您可以尝试在<my-app> 标签之间包含您的custom.html。不确定 javascript 文件的加载速度和 w3IncludeHtml() 的速度。在此处查看指南w3schools.com/howto/howto_html_include.asp以上是关于如何在 ionic 2 中创建自定义加载页面的主要内容，如果未能解决你的问题，请参考以下文章