Question

我在使用离子的移动应用程序。该应用有多个iframe，其中加载了外部页面。 iframe加载在android（设备和模拟器）和浏览器中正常工作。但在iOS上，外部页面未在iframe中完全加载。该页面在页面的底部被切断，请参阅详细信息的屏幕截图： iOS Device Screen

我的问题是为什么会发生这种情况以及为什么它正在开发android。以下代码段显示了我如何添加iframe：

page.html中

<ion-view  class="center" view-title="">          
<ion-content>
<!-- div used to enable scrolling in the iframe on iOS -->
<div class="scroll-wrapper">
   <iframe id="seats" width ="100%" height ="100%" ng-src="  {{seatPath}}" ng-onload="hideProgess()" ng-show="!loadError" ></iframe>
</div>
</ion-content>

的main.css

  .center .scroll-content {
  display: table !important;
  width: 100% !important;
  height: 100% !important;
  text-align: center;
}
.center .scroll {
  display: table-cell !important;
  vertical-align: middle !important;
}

.scroll-wrapper {
  position: fixed; 
  right: 0; 
  bottom: 50px; 
  left: 0;
  top: 0;
  -webkit-overflow-scrolling: touch;
  overflow-y: scroll;
}

.scroll-wrapper iframe {
  height: 100% !important;
  width:  100% !important;
  min-height: 100% !important;
  bottom: 50px !important;; 
}

修改
我已经测试了其他网页，当我将它们加载到iframe中时，即使在ios上也可能存在我想加载的网页有错误吗？

Answer 1

尝试将其添加到标记内的config.xml文件中：

<allow-navigation href="*" />

离子iframe加载不能完全在iOS上运行

1 个答案: