【问题标题】：Lose the rendering when adding components on same page在同一页面上添加组件时丢失渲染
【发布时间】：2019-09-01 19:37:45
【问题描述】：

我想在同一页面上添加多个组件。但是当我添加组件头时。我在本地主机上没有更多的渲染。但是，如果我删除标题，我会再次进行渲染。但是，对于第一种情况，对于另一种情况，我在终端上没有错误。我已经检查了this answer by Adrien Brunelat，但我这边似乎一切正常。

主要组件

app.component.html:

<app-header></app-header>
<app-menu></app-menu>

app.component.ts:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'conFusion';
}

标题组件

header.component.html

<mat-toolbar color="primary">
  <span><img src="/assets/images/logo.png" height=30 width=41></span>
  <a mat-button><span class="fa fa-home fa-lg"></span> Home</a>
  <a mat-button><span class="fa fa-info fa-lg"></span> About</a>
  <a mat-button><span class="fa fa-list fa-lg"></span> Menu</a>
  <a mat-button><span class="fa fa-address-card fa-lg"></span> Contact</a>
</mat-toolbar>

<div class="container jumbotron"
    fxLayout="row"
    fxLayout.sm="column" 
    fxLayout.xs="column" 
    fxLayoutAlign.xs="start center"
    fxLayoutAlign.sm="start center" 
    fxLayoutAlign.gt-sm="center center" 
    fxLayoutGap="10px">

  <div fxFlex fxFlex.gt-sm="50%">
    <h1>Ristorante Con Fusion</h1>
    <p>We take inspiration from the World's best cuisines, and create a unique fusion experience. Our lipsmacking creations
      will tickle your culinary senses!</p>
  </div>
  <div fxFlex fxFlex.gt-sm="20%">
    <img src="/assets/images/logo.png" alt="Logo">
  </div>
  <div fxFlex></div>
</div>

header.component.ts

import { Component, OnInit } from '@angular/core';

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

    title = 'Header works!';

  constructor() { }

  ngOnInit() {
  }

}

菜单完美运行，如果您需要，我也可以与您分享。我的存储库也是私有的，但我可以与您共享。

这里是the Stackblitz（我做到了！！）。它返回了我在终端中没有的错误：

Error in /turbo_modules/@angular/compiler@8.2.3/bundles/compiler.umd.js (2603:21)
Can't resolve all parameters for MenuComponent: (?).

版本

我有 angular8.2.2

【问题讨论】：

请提供使用 stackblitz 或类似方法的最小复制示例。
是的，绝对没有理由你不应该这样做，但如果有一个快速的堆栈闪电，问题会更清楚
在 header.compent.html 中开始评论内容，直到它起作用。老套路！ ;) 如果所有内容都在其中注释。它必须是带有声明或其他东西的东西。但我怀疑可能是css
至少提供Menu的代码，这样我们可以同时尝试。我使用提供的代码进行了一次堆栈闪电战，并且标题运行良好：stackblitz.com/edit/angular-c496j2
@kvetis 谢谢大家的提示，我不知道这个工具。并且无法导入我的 bitbucket 存储库，也无法从我的计算机上单击并拖动。不过你可以找到它here

标签： angular typescript

【解决方案1】：

解决方案是声明我在app.module.ts 中使用的模块：

...
import { HeaderComponent } from './header/header.component';
import { FooterComponent } from './footer/footer.component';

@NgModule({
  declarations: [
    AppComponent,
    MenuComponent,
    DishdetailComponent,
    HeaderComponent,
    FooterComponent
...

我不知道为什么它没有显示任何错误。

【讨论】：