2016-11-30 1 views
1

나는 앰프 목록을 사용하고 있으며, 나는 얻은 결과에 따라 동적 인 높이를 갖고 싶습니다. 그것을 할 수있는 방법이 있습니까? 나는 그것을 끝낼 수 없었다.동적 높이가있는 앰프 목록

<amp-list src="request-url"> 
    <template type="amp-mustache" id="amp-template-id"> 
    ... 
    </template> 
</amp-list> 

사용 가능한 모든 레이아웃에는 앰프 목록 수준 또는 상위 수준의 크기가 필요합니다. 그러나 높이를 지정하고 싶지는 않습니다. 내 결과에는 1 또는 12 개의 항목이있을 수 있습니다.

+0

에 오신 것을 환영합니다. 질문을 향상 시키려면 다음 링크를 읽으십시오 : [Tour] (http://stackoverflow.com/tour) | [묻는 방법] (http://stackoverflow.com/help/how-to-ask) | [최소, 완전하고 검증 가능한 예제] (http://stackoverflow.com/help/mcve) – Tom

답변

1

AMP에는 동적 레이아웃이 없습니다. 이것은 AMP의 큰 장점 중 하나 인 페이지 로딩 중 리플 로우를 방지하기위한 것입니다. 그러나 앰프 목록은 필요할 경우 자동으로 더 많은 공간을 차지합니다 (사용 가능).

는이 작업을 지원하기 위해 다음과 같은 세 가지 작업을 수행 할 수 있습니다

  1. 은 첫 번째 요소를 포함하기에 충분한 높이로 고정 높이 레이아웃을 사용합니다. 이렇게하면 하나의 요소 만있는 경우 목록이 너무 많은 공간을 차지하지 않습니다.
  2. 목록이 축소 된 경우 넘침 버튼을 지정하십시오.
  3. 목록을 초기 뷰포트 아래 또는 가능한 한 맨 아래까지 배치하여 목록에 더 많은 공간을 제공하도록 amp-runtime을 활성화하십시오. 여기

는 공식 문서가 이것에 대해 말할 것입니다 :

A 목록이 정상적인 AMP 흐름을 사용하여 높이를 업데이트 할 수있는 AMP 런타임을 요청로드 한 후 더 많은 공간을 필요로합니다. AMP 런타임이 새 높이에 대한 요청을 충족시키지 못하면 사용 가능한 경우 오버플로 요소를 표시합니다. 그러나 문서 맨 아래에 amp-list 요소를 배치하면 AMP 런타임에서 크기를 조정할 수 있습니다.

출처 : 유래에 https://www.ampproject.org/docs/reference/components/amp-list

관련 문제