Я хочу сделать переключение и развернуть односекционную навигацию используя amp-bind - PullRequest
Новая
       14

Я хочу сделать переключение и развернуть односекционную навигацию используя amp-bind

0 голосов
/ 19 апреля 2019

Я хочу сделать глобальную навигацию с amp-bind.
Требования,

  1. Переключение при нажатии на элемент (открыт, если закрыт, закрыт, если открыт) * ​​1006 *
  2. При нажатии на элемент B Все элементы, кроме элемента B, закрываются

В приведенном ниже примере (который имитирует вкладку) может быть выполнено второе требование, но не первое. 

<amp-state id="menu">
  <script type="application/json">
  {
    "index": 0
  }
  </script>
</amp-state>

<p [text]="'index is ' + (menu.index + 1)">index is …</p>

<ul>
  <li>
    <button on="tap:AMP.setState({menu: {index: 0}})"
    [aria-expanded]="menu.index == 0 ? 'true' : 'false'"
    aria-expanded="true"
    class="trigger">Tab 1</button>
  </li>
  <li>
    <button on="tap:AMP.setState({menu: {index: 1}})"
    [aria-expanded]="menu.index == 1 ? 'true' : 'false'"
    aria-expanded="false"
    class="trigger">Tab 2</button>
  </li>
</ul>
<div [aria-hidden]="menu.index == 0 ? 'false' : 'true'"
  aria-hidden="false"
  class="content">Content 1</div>
<div [aria-hidden]="menu.index == 1 ? 'false' : 'true'"
  aria-hidden="true"
  class="content">Content 2</div>
...