Angular应用程序存在类声明问题，可能存在不正确的装饰器使用

我收到了关于类、UserAddComponent和声明的以下错误：

    ERROR in src/app/user/user.module.ts:10:37 - error NG6001: The class 'UserAddComponent' is 
listed in the declarations of the NgModule 'UserModule', but is not a directive, a component, or a 
pipe. Either remove it from the NgModule's declarations, or add an appropriate Angular decorator.

10   declarations: [UserViewComponent, UserAddComponent],
                                       ~~~~~~~~~~~~~~~~

  src/app/user/user-add/user-add.component.ts:6:14
    6 export class UserAddComponent {
                   ~~~~~~~~~~~~~~~~
    'UserAddComponent' is declared here.
src/app/user/user-add/user-add.component.ts:6:14 - error NG6003: Appears in the NgModule.exports of 
UserModule, but could not be resolved to an NgModule, Component, Directive, or Pipe class.

Is it missing an Angular annotation?

6 export class UserAddComponent {
               ~~~~~~~~~~~~~~~~
src/app/user/user.module.ts:20:14 - error NG6002: Appears in the NgModule.imports of AppModule, but 
itself has errors

20 export class UserModule {
                ~~~~~~~~~~

这两个文件是user-add.components.ts：

import {User} from '../../models/user';
import {Store} from '@ngrx/store';
import {UserState} from '../store/reducer/user.reducer';
import {addUser} from '../../user.actions';

export class UserAddComponent {

  constructor(private store: Store<UserState>) {
  }

  addUser(userName: string): void {
    const user = new User();
    user.name = userName;
    this.store.dispatch(addUser(user));
  }
}

---

我对Angular（这是我的第一个web应用程序）非常陌生，所以如果这是一个完全没有问题的问题，请原谅，但目前为止，我很困惑。据我所知，我正在正确使用decorator@NgModule。这些错误似乎是循环的，因此可能存在参考错误。我将此代码基于本文中的模板：。这是相当新的，所以我不确定这是版本不兼容，除非作者使用了旧版本。谢谢。

对于类

UserAddComponent

，您错过了组件装饰程序。只需在类上方添加@Component（{}）

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

@Component({
  selector: 'selector-name',
  styleUrls: ['./selector-name.component.scss'],
  templateUrl: './selector-name.component.html',
})

export class UserAddComponent {
    ...
}

在模块的声明数组中，您应该声明

组件、指令、管道

。不是普通的班级

这里，

@Component（{}）

装饰器将一个类标记为角度组件，并提供配置元数据，用于确定在运行时如何处理、实例化和使用该组件

---

再次执行

ng serve

可以解决组件已添加时的问题

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

@Component({
  selector: 'selector-name',
  styleUrls: ['./selector-name.component.scss'],
  templateUrl: './selector-name.component.html',
})

export class UserAddComponent {
    ...
}