Будет ли код, работающий в шаблоне AMP Start, работать в Amp-story из коробки? Какие изменения необходимы?

Question

Будет ли код, работающий в шаблоне AMP Start, работать в Amp-story из коробки? Какие изменения необходимы?

Например, упростит ли эта форма поиска, используемая в Adventures, шаблон AMP Start, работу в amp-story? Если нет, то почему нет?

AMP Start - Создавайте отзывчивые, молниеносные страницы AMP с нашими шаблонами и компонентами

https://www.ampstart.com/templates

  <!-- Search Form -->
  <div class="travel-hero-search">
    <label class="travel-input-icon travel-shadow flex col-12 relative rounded">
      <input class="travel-input travel-input-big travel-input-clear border block col-12 rounded" list="locations" type="text" name="query" placeholder="Where would you like to go?" on="
          change:AMP.setState({
            fields_query: event.value,
            fields_query_live: event.value,
            fields_query_edited: query_query != event.value
          });
          input-debounced:AMP.setState({
            fields_query_live: event.value
          });
        " value="" [value]="fields_query">

    <amp-list layout="flex-item" src="/api/places?types=(regions)&types=(cities)&input=" [src]="'/api/places?types=(regions)&types=(cities)&input=' + fields_query_live">
      <template type="amp-mustache">
        <datalist id="locations">
          {{#predictions}}
          <option value="{{description}}">
          {{/predictions}}
        </option></datalist>
      </template>
    </amp-list>

    <div class="travel-hero-search-dates flex my2 justify-around">
      <label class="travel-date-input relative bold flex-auto" [class]="'travel-date-input relative bold flex-auto' + (fields_departure ? ' travel-date-input-touched' : '')">
        <input class="block relative p0 z1" type="date" placeholder="yyyy-mm-dd" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" title="yyyy-mm-dd" name="departure" on="
            change:AMP.setState({
              fields_departure: true,
              fields_departure_edited: true
            })
          ">

    <a href="travel-results.amp" class="ampstart-btn travel-input-big rounded center bold white block col-12" on="
        tap:AMP.setState({
            ui_reset: false,
            ui_filterPane: false,
            query_query: fields_query,
            fields_query_edited: false,
            query_departure: fields_departure,
            fields_departure_edited: false,
            query_return: fields_return,
            fields_return_edited: false,
            query_maxPrice: fields_maxPrice,
            fields_maxPrice_edited: false,
            query_city: fields_city,
            fields_city_edited: false,
            query_type: fields_type,
            fields_type_edited: false,
            query_sort: fields_sort,
            fields_sort_edited: false,
        })
      ">
      Find Adventures & Tours
    </a>
  <!--/ Search Form -->

Answer 1

Нет, по многим причинам.

• История AMP не поддерживает прокрутку; все эти шаблоны требуют прокрутки.
• <amp-story> тег должен быть прямым потомком тела и не иметь других братьев и сестер; все эти шаблоны имеют другое содержание как потомок тела.
• Многие из компонентов, используемых в этих шаблонах, запрещены в историях AMP.
• Некоторые из компонентов (например, ссылки), используемые в шаблонах, возможны в историях AMP, но требуют другой разметки.

Эти шаблоны предназначены для использования в неистовых документах. Шаблоны для историй, безусловно, возможны, и, надеюсь, скоро появятся.

Форма поиска в указанном шаблоне AMP Start не будет работать в журналах, так как в настоящее время формы в журналах запрещены.