Question

我对Angular非常陌生。在我的Angular应用中，我在src / app / components / navbar中有一个navbar文件夹，而我的navbar.component.ts文件看起来像这样：

navbar.component.ts

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

navbar.component.html

<p>nav bar is working</p>

index.html

<app-navbar></app-navbar>

但是当我运行localhost服务器时，它没有在index.html中显示nav bar is working。我该如何解决？

Answer 1

您应该像这样在app.component.html页面中使用组件-

<app-navbar></app-navbar>

不在index.html中，因为这不是您的引导程序组件。

您总是在index.html文件中使用<app-root></app-root>组件，因为这是这样在主模块中引导的组件-

bootstrap: [AppComponent]

Answer 2

在app-module.ts中导入导航栏，并在<app-navbar></app-navbar>中将栏杆app.component.html

为什么我的导航栏组件在Angular中不起作用？

2 个答案: