ion-content resizing when loading data dynamically

Question

i have an ion-nav-view inside ion-content.

i want to load data dynamically into ion-nav-view.

when loading data dynamically into ion-nav-view its not resizing to content height instead its loading in a small div with a scroll bar.

<ion-view view-title="My view">
   <ion-content class="padding">
    <div id="test">
        <a href="#">1</a>
        <a href="#">2</a>
        <a href="#">3</a>
     </div>
     <ion-nav-view name="mydynview">
     </ion-nav-view>
   <ion-content >
</ion-view >

i am loading a template into "mydynview" from my controller.

mytemplate.html:

 <ion-view view-title="About">

<ion-content class="padding" delegate-handle="testhandle">
<!-- <ion-nav-view> -->

    <p ng-click="onlc()">test</p>
    <p ng-click="onlc()">test</p>
    <p ng-click="onlc()">test</p>
    <p ng-click="onlc()">test</p>
    <p ng-click="onlc()">test</p>
<!-- </ion-nav-view> -->
</ion-content >

I read about resizing from here: http://ionicframework.com/docs/api/directive/ionContent/

and even that is not working.

help will be highly appreciated.

Answer 1

The documentation states that you need to call $ionicScrollDelegate.resize() "after the content has loaded."

Since you did not post your controller, it's not possible for me to evaluate if your calling the .resize() method before the load is asynchronously completed.

Here's a quick and dirty way for you to test if it's a timing issue: call $ionicScrollDelegate.resize() within a $timeout with a 500ms delay. If that fixes the problem, you're calling .resize() before the content has finished loading so it doesn't have the complete view to calculate the new size accurately. This isn't a solution; it's a way to diagnose the problem. If it turns out this is the problem, then you want to call .resize() on your promise / callback / whatever that gets fired when your template is done loading.