IBM mobilefirst 中的 Ionic / Angular 应用程序 运行 中的显示问题

Question

这是我第一次开始使用 angular 和 ionic 开发移动应用程序，如果这只是一个简单的问题，请原谅我。我尝试用谷歌搜索这个问题，但无济于事。这就是问题所在，我尝试在下面的 link 中重新创建使用 Ionic 创建的示例应用程序。

link here

我使用 IBM MobileFirst 环境 运行 我的应用程序。问题是，如果我没有在 body 的结束标记之前添加很多 < br > 标记，则显示结果会像右边的那样（见附图）。

谁能告诉我为什么会这样？

左侧图片中的代码片段：

....
....
<script src="ionic/js/ionic.bundle.js"></script>
<!-- New lines to load our modules -->
<script src="app/app-main.js"></script>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>

右边的代码片段

....
....
<script src="ionic/js/ionic.bundle.js"></script>
<!-- New lines to load our modules -->
<script src="app/app-main.js"></script>
</body>
</html>

基本上，只有在正文的结束标记之前添加大量 < br > 标记，它才会得到修复。 Ionic 不是应该调整到全高吗？还是内容的自然高度？

注意：如果您看不到图像，请告诉我

Answer 1

Worklight 中预先存在的 CSS 可能会导致此问题。您可以尝试通过添加以下内容来修复它：

html, body {
    height: 100%;
}

建议您在 MobileFirst 7.1 中使用 Cordova 应用程序，而不是使用混合应用程序。与 Ionic 的集成就简单多了。在这里阅读更多：https://www.raymondcamden.com/2015/03/23/working-with-ibm-mobilefirst-and-the-ionic-framework/