动态加载数据时调整离子内容的大小答案

【问题标题】：ion-content resizing when loading data dynamically动态加载数据时调整离子内容的大小
【发布时间】：2015-07-27 04:45:44
【问题描述】：

我在 ion-content 中有一个 ion-nav-view。

我想将数据动态加载到 ion-nav-view 中。

当将数据动态加载到 ion-nav-view 时，它不会调整到内容高度，而是加载到带有滚动条的小 div 中。

<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 >

我正在从我的控制器将模板加载到“mydynview”中。

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 >

我从这里读到了关于调整大小的信息： http://ionicframework.com/docs/api/directive/ionContent/

即使这样也行不通。

我们将不胜感激。

【问题讨论】：

你找到什么了吗？
不是一个完美的解决方案：由于 $ionicScrollDelegate.resize() 不起作用，我已经用 js 自己调整大小。 var newHeight= $window.innerHeight; var tabsHeight = document.getElementById('HIPACIonTabs').style.height; document.getElementById('MyHIPACIonNavView').style.height= (newHeight-230)+'px'; //取窗口innerHeight并减去页脚高度，页脚为49px
嗨@praveenseela - 我在下面发布了一个答案，用于诊断您的问题是否是由异步调用引起的时间问题引起的。 $ionicScrollDelegate.resize() 确实有效，您只需确保在内容加载后调用它。

标签： ionic-framework ionic

【解决方案1】：

documentation 声明您需要在“内容加载后”调用$ionicScrollDelegate.resize()。

由于您没有发布您的控制器，我无法评估您是否在异步完成加载之前调用.resize() 方法。

这是一种快速而肮脏的方法来测试是否是时间问题：在 $timeout 内调用 $ionicScrollDelegate.resize()，延迟 500 毫秒。如果这样可以解决问题，您将在内容完成加载之前调用.resize()，因此它没有完整的视图来准确计算新大小。这不是解决方案；这是一种诊断问题的方法。如果事实证明这是问题所在，那么您想在您的承诺/回调/模板加载完成时触发的任何内容上调用 .resize()。

【讨论】：