时间戳

首页 > 解决方案 > 自定义组件不是 Angular CLI 应用程序中的已知元素

javascript - 自定义组件不是 Angular CLI 应用程序中的已知元素

问题描述

我正在考虑使用 Angular CLI 学习 Angular 8。

我在核心模块中添加了两个新组件，然后将其导入到应用程序模块中。

当我尝试在我的应用程序 html 中呈现组件时，控制台中会抛出“未知元素”错误。

我不确定为什么？

这是我的app.module.ts

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";

import { AppComponent } from "./app.component";
import { NoopAnimationsModule } from "@angular/platform-browser/animations";
import { CoreModule } from "./core/core.module";

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, NoopAnimationsModule, CoreModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

我的core.module.ts

import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { InputComponent } from "../input/input.component";
import { GraphComponent } from "../graph/graph.component";

@NgModule({
  declarations: [InputComponent, GraphComponent],
  imports: [CommonModule],
  exports: [InputComponent, GraphComponent]
})
export class CoreModule {}

app.component.html

<div>
  <InputComponent></InputComponent>
  <GraphComponent></GraphComponent>
</div>

以及其中一个自定义组件的示例：

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

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

  constructor() { }

  ngOnInit() {
  }

}

标签： javascriptangularcomponentsangular-cli

解决方案

我刚刚意识到我指的不是具有正确选择器的组件！

我应该在app-input.app-graphapp.component.html

推荐阅读