如何使用CLI在Angular 4中创建新组件

Question

在角度2我使用

ng g c componentname

但它在Angular 4中不受支持,因此我手动创建它,但它显示错误,它不是模块.

Answer 1

在Angular4中,这将是相同的.如果您收到错误,我认为您的问题出在其他地方.

在命令提示符下键入

ng生成组件YOURCOMPONENTNAME

甚至有速记本:命令generate可以作为g和component作为c:

ng gc YOURCOMPONENTNAME

你可以使用ng --help,ng g --help或者ng g c --help用于文档.

Ofcourse将YOURCOMPONENTNAME重命名为您要使用的名称.

文档: angular-cli将在app.module.ts中自动添加对组件,指令和管道的引用.

更新:这仍然适用于Angular版本7.

Answer 2

通过开发服务器生成和提供 Angular 项目 -

首先转到您的项目目录并键入以下内容 -

ng new my-app
cd my-app
ng generate component User (or) ng g c user 
ng serve

这里“ D:\Angular\my-app> ”是我的Angular应用程序项目目录，“ User ”是组件的名称。

公地看起来像 -

D:\Angular\my-app>ng g component User
  create src/app/user/user.component.html (23 bytes)
  create src/app/user/user.component.spec.ts (614 bytes)
  create src/app/user/user.component.ts (261 bytes)
  create src/app/user/user.component.css (0 bytes)
  update src/app/app.module.ts (586 bytes)

Answer 3

1)首先转到您的项目目录

2)然后在终端的Command下面运行.

ng generate component componentname

要么

ng g component componentname

3)之后你会看到这样的输出,

create src/app/test/componentname.component.css (0 bytes)
create src/app/test/componentname.component.html (23 bytes)
create src/app/test/componentname.component.spec.ts (614 bytes)
create src/app/test/componentname.component.ts (261 bytes)
update src/app/app.module.ts (1087 bytes)

Answer 4

用于在特定文件夹下创建组件

ng g c employee/create-employee --skipTests=false --flat=true

这一行将创建一个名为“employee”的文件夹，在它下面创建一个“create-employee”组件。

无需创建任何文件夹

ng g c create-employee --skipTests=false --flat=true

Answer 5

ng g component componentname

它生成组件并将组件添加到模块声明中.

在手动创建组件时,您应该在模块的声明中添加组件,如下所示:

@NgModule({
  imports: [
    yourCommaSeparatedModules
    ],
  declarations: [
    yourCommaSeparatedComponents
  ]
})
export class yourModule { }

Answer 6

如果要创建没有.spec文件的新组件,可以使用

ng g c component-name --spec false

您可以使用找到这些选项 ng g c --help

Answer 7

确保您在项目cmd行中

    ng g component componentName