amphtml: Use Amp List for showing more content when height is not available

We want the user to be able to load a amp-list of more comments after the initial page load. We don’t know the height of these comments because they can be any length. We can’t use the overflow button because we already have our own overflow button whose source is updated on amp-bind.

      <script type="application/json">
      {
        "moreCommentsSrc": "/json/comments2.json"
      }
      </script>
    </amp-state>

      <amp-list class="mt1" width="auto" height="600" [height]="comments.moreCommentsSrc == '/json/comments2.json' ? 600 : 1000" layout="fixed-height"
        src="/json/comments2.json"
        [src]="comments.moreCommentsSrc"
        >
        <template type="amp-mustache">
          <div class="flex px1 pt1 depth-{{depth}}">
            <amp-img width="44" height="44" class="mr1 flex-none" alt="user" src="/img/ic_account_box_black_48dp_1x.png"></amp-img>
            <div class="ampstart-card p1 comment">
              <p><span class="user">{{user}}</span> <span class="date">{{datetime}}</span></p>
              <p>{{text}}</p>
            </div>
          </div>
        </template>
      </amp-list>
      <button class="ampstart-btn caps m1 mb3 show" [class]="comments.moreCommentsSrc == '/json/comments2.json' ? 'ampstart-btn caps m1 mb3 show' : 'ampstart-btn caps m1 mb3 hide'" on="tap:AMP.setState({comments: {moreCommentsSrc: '/json/comments3.json'}})">Show more</button>```