RouterLink внутри панели навигации в выпадающем меню не работает (Angular и Springboot) - PullRequest
Новая
       12

RouterLink внутри панели навигации в выпадающем меню не работает (Angular и Springboot)

0 голосов
/ 26 марта 2019

Я должен разработать веб-приложение, используя пружинную загрузку и угловой.В этом приложении есть вкладка, которая содержит различные данные (связывается с mongoDB). Я создал компонент для добавления новых данных в эту вкладку.Проблема в том, что когда я пытаюсь нажать на ссылку в выпадающем меню внутри панели навигации, я не перенаправляю меня на нужную страницу, а показываю мне страницу белого ярлыка

Я пытался использовать routerLink и href, удалить раскрывающийся список и использоватькнопка в навигационной панели.сначала я добавил navar в мой index.html, затем попробовал внутри app.component.

мой index.html 

 /* When the user clicks on the button, 
          toggle between hiding and showing the dropdown content */
          function myFunction() {
            document.getElementById("myDropdown").classList.toggle("show");
          }
          
          // Close the dropdown if the user clicks outside of it
          window.onclick = function(e) {
            if (!e.target.matches('.dropbtn')) {
            var myDropdown = document.getElementById("myDropdown");
              if (myDropdown.classList.contains('show')) {
                myDropdown.classList.remove('show');
              }
            }
          }
       <header>
          <div id="riga-top"></div>
          <nav id="navbar">
            <div id="area-logo-universita">
              <img src="assets/img/logo-unicam.jpg">
            </div>
            <div id="area-logo-servizio">
              <img src="">
            </div>
            <ul>
              <li class="active collapse">
                <a href="/contatto">HOME</a>
              </li>
              <li class="dropdown collapse">
                <button class="dropbtn" onclick="myFunction()">Aziende
                  <span class="caret"></span>
                </button>
                <div class="dropdown-menu dropdown-content" id="myDropdown">
                  <a href="/azienda" class="ainside">Aggiungi Azienda</a>
                </div>
              </li>
                      
          </nav>
        </header>
        <!-- Left side column. contains the logo and sidebar -->
        <div class="content-wrapper" style="background-color: rgb(236, 240, 245) !important; background-image: url(&quot;/Content/images/bg-home.jpg&quot;) !important; background-repeat: no-repeat !important; min-height: 710px;">
          <div class="container">
            <!-- Main content -->
            <section class="content">
              <app-root></app-root>
            </section><!-- /.content -->
          </div>
        </div>
        <footer>
        </footer>

1 Ответ

1 голос
/ 26 марта 2019

Вы должны внедрить Router Link, как показано ниже, и не должны использовать href, вы можете найти полную документацию здесь.

Заменить следующее 

<li class="active collapse">
    <a href="/contatto">HOME</a>
</li>

К этому 

<li class="active collapse">
    <a [routerLink]="['/contatto']">
      HOME
    </a>
 </li>
...