Блог

Главная - Вопросы по программированию - Динамическая вкладка в angular

Динамическая вкладка в angular

#angular #bootstrap-4 #angular-material

#angular #bootstrap-4 #angular-материал

Вопрос:

в моем проекте есть 2 вкладки, одна из которых — фильмы, а другая — песни

https://stackblitz.com/edit/angular-ivy-koal1q

моя проблема в том, что когда я переключаюсь между вкладками, вкладка не сохраняет свой предыдущий статус, мой код создает вкладки с помощью кнопки закрытия, когда я нажимаю на вкладку, она перенаправляет содержимое вкладки, но я хочу поддерживать отдельный контейнер для каждой вкладки, как добиться в angular

Ответ №1:

menu.component.html

 <nav class="menu">
  <ul class="menu-options-list">
    <li *ngFor="let option of menuOptions" class="menu-option"  [routerLink]="option.url" routerLinkActive="active">
      {{option.name}}
    </li>
  </ul>
</nav>

menu.component.css

 .active {
   background-color: #7a9d96;
  cursor: pointer;
}

Вот рабочая демонстрация https://stackblitz.com/edit/angular-ivy-y39htm

Комментарии:

1. извините за небольшую поправку, я хочу, чтобы несколько вкладок с отдельным контейнером,, когда я что-то пишу на вкладке фильмы, должны сохраняться, когда я возвращаюсь с вкладки песни на вкладку фильмы, (не должны быть пустыми при переходе с одной вкладки на другую вкладку)

2. Я надеюсь, это полезно!