角度 7 嵌套组件

Question

我是一个有WPF经验的人。 现在我决定尝试Web开发

以及从经验和动手而不是阅读中学习的人

我正在尝试创建一个简单的网络应用程序。

使用引导程序 4 的 Angular 7

所以我创建了一个简单的 Angular 应用程序安装的引导程序 4，然后复制了仪表板的代码.html修改了这个模板 https://www.creative-tim.com/product/material-dashboard 我知道这个模板有一个 Angular 版本，但我想了解事情是如何工作的。

我已经在角度应用程序中成功使用了模板

模板截图

但是我想分离模板的导航

所以我添加了一个名为nav的组件并将代码粘贴到其中

<li class="nav-item active  ">
<a class="nav-link" href="./dashboard.html">
<i class="material-icons">dashboard</i>
<p>Dashboard</p>
</a>
</li>

那么这是我的应用程序组件的代码.html

<div class="sidebar-wrapper">
<ul class="nav">
<nav></nav>
</ul>
</div>

但是导航没有显示在我的 Web 中，这就是现在的样子

不工作的组件的屏幕截图

这是app.module.ts的代码

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { NavComponent } from './nav/nav.component';
@NgModule({
declarations: [
AppComponent,
NavComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

我错过了什么？

如果我需要从另一个文件发布代码。请让我知道。谢谢。

Answer 1

需要 nav 组件的完整代码才能确定，但有根据的猜测是您需要改用<app-nav></app-nav>。检查导航组件的选择器属性