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 []

中像这样：

imports: [RouterModule]

如果您有一个单独的路由模块，请将其导入并导出

<router-outlet>使得HTML内容在Angular中消失

1 个答案: