angular仅在实际显示时生成部分

Question

我使用angular来显示渲染更大的数据集。在data.data中有几个键，每个键对应一个大约3000行的数组。当用户首次打开页面时，所有showraw[key] - s都设置为false，因此他们会在panel-heading - s中获取可能的键列表，并在点击标题是他们实际看到数据的时候。在我添加此部分之前，页面加载速度非常快，现在需要相当长的时间（几秒钟，并且不是因为获取数据，因为之前也提取了整个数据集，我只是没有显示所有内容） 。据我所知，尽管没有显示，但角度基本上呈现了所有内容（虽然我猜它可能不存储它，因为每次我点击其中一个标题来显示数据时，它仍需要一两秒钟才能显示出现）。

<div class="panel panel-default">
    <div class="panel-heading"><h2>Raw data</h2></div>
    <span ng-repeat="(key,val) in data.data">
    <div class="panel-heading" ng-click="showraw[key] = ! showraw[key]"><b>{{key}}</b></div>
      <table class="table table-striped table-hover table-responsive" ng-show="showraw[key]">

        <tbody>
          <tr ng-repeat="line in val track by $index" ><td ng-repeat="l in line.split(' ') track by $index">{{l}} </td></tr>

        </tbody>
      </table>
    </span>
</div>

我的问题如下：加速页面加载的最佳做法是什么？我不希望让用户等待呈现未向她显示的数据。