Hi guys, newbie here and it’s my first time to use Ionic framework and I love it! Everything worked smoothly in developing my side-menu app to building it for Android. When I build it for iOS though, everything worked great except for my two fullscreen iframes.
The first iframe loads this page: http://kindlansing.com/kind-leafly-menu/
When I run it on my iPhone, it initially shows just the header title and then it disappears and just shows a blank white page.
The second one loads this page: http://kindlansing.com/blog/
This one loads the page but I can’t scroll over it.
I have these settings:
config.xml
<access origin="*"/> <allow-navigation href="*"/>
first and second iframe pages are basically the same
<ion-view title="{{menuSetting.title}}" id="menu-page-id" ng-controller="menuCtrl">
<ion-content class="iframe-content has-header" padding="false">
<iframe ng-show="menuSetting" src="{{menuSetting.iframe_src | trusted}}" width="100%" height="100%"></iframe>
</ion-content>
</ion-view>
my.css
.iframe-content > .scroll { height: 100%; } .iframe-content > .scroll > iframe { min-height: 100%; }
filter
.filter('trusted', ['$sce', function ($sce) { return function(url) { return $sce.trustAsResourceUrl(url); }; }]);
xcode
allow arbitrary loads: YES
I apologize for this long post, but I’m so lost on how to solve this problem. Please help.
I was able to open it in the InAppBrowser. I want it to open on a page though so the side menu button can still be seen. Is there a way to do it?