angular - 使 html 内容在 Angular 中消失

Question

我不确定为什么 <router-outlet> </router-outlet>制作app.component.html的内容消失。例如，因为我没有 <router-outlet> </router-outlet>在下面的代码中，一切都很好。

app.component.html

<div style="text-align:center">
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
          <div class="navbar-header">
            <a class="navbar-brand" href="#">Abdulaziz</a>
          </div>
          <ul class="nav navbar-nav">
            <li class="active">
              <a href="#home">Home</a>
            </li>
            <li>
              <a href="#pics">Pictures</a>
            </li>
            <li>
              <a href="links.html">Links</a>
            </li>
            <li>
              <a href="#articles">Articles</a>
              </li>
          </ul>
        </div>
      </nav>

      <br> <br>

</div>

每当我添加 <router-outlet> </router-outlet>在</div>下内容立即消失。请注意，此问题不会出现在我的另一个项目中。

Answer 1

试试这个:

将 RouterModule 导入您的 app.module.ts

import { RouterModule } from '@angular/router';

将 RouterModule 添加到您的导入中 []

像这样:

imports: [RouterModule]

如果你有一个单独的路由模块，在那里导入并导出