我正在使用Angular 4和Angular CLI,我可以用下面的命令创建一个新组件。

E:\HiddenWords>ng generate component plainsight

但我需要在plainsight内生成一个子组件。有办法用Angular CLI来实现吗?


当前回答

有几种方法可以在特定目录中创建组件。

方法1:“在集成终端中打开”-快速,简单,无错误的方法

例如,你想在app/common文件夹中创建一个组件,如下图所示,然后按照以下步骤操作

右键单击要在其中创建组件的文件夹。 选择“在集成终端中打开”或“在命令提示符中打开”选项。 在新终端(你会看到你选择的路径),然后输入ng g c my-component

你也可以通过这张图片来检查这个过程

方法二:复制相对路径,粘贴到终端上

右键单击要在其中创建组件的文件夹 从上下文菜单中,选择拷贝相对路径 在终端上,输入cd,按空格键,然后按ctrl + v粘贴复制的路径,并按Enter 您将看到目录已被更改。

你也可以通过这张图片来检查这个过程

方法三:在终端上输入完整路径

例如,你想在某个文件夹中创建组件,你输入整个命令,包括路径和组件名称。

ng g c relative-path/my-component

你也可以通过这张图片来检查这个过程

注意(方法-3):angular不允许你在app文件夹外创建组件,因此对于组件,你的基本路径将是app,这就是为什么在我的例子中,我必须从auth/a-component开始,而不是src/app/auth/a-component

其他回答

有几种方法可以在特定目录中创建组件。

方法1:“在集成终端中打开”-快速,简单,无错误的方法

例如,你想在app/common文件夹中创建一个组件,如下图所示,然后按照以下步骤操作

右键单击要在其中创建组件的文件夹。 选择“在集成终端中打开”或“在命令提示符中打开”选项。 在新终端(你会看到你选择的路径),然后输入ng g c my-component

你也可以通过这张图片来检查这个过程

方法二:复制相对路径,粘贴到终端上

右键单击要在其中创建组件的文件夹 从上下文菜单中,选择拷贝相对路径 在终端上,输入cd,按空格键,然后按ctrl + v粘贴复制的路径,并按Enter 您将看到目录已被更改。

你也可以通过这张图片来检查这个过程

方法三:在终端上输入完整路径

例如,你想在某个文件夹中创建组件,你输入整个命令,包括路径和组件名称。

ng g c relative-path/my-component

你也可以通过这张图片来检查这个过程

注意(方法-3):angular不允许你在app文件夹外创建组件,因此对于组件,你的基本路径将是app,这就是为什么在我的例子中,我必须从auth/a-component开始,而不是src/app/auth/a-component

上面的选项不适合我,因为与在终端中创建目录或文件不同,当CLI生成一个组件时,它默认将路径src/app添加到您输入的路径中。

如果我从主应用文件夹中生成组件像这样(错误的方式)

ng g c ./src/app/child/grandchild 

生成的组件是这样的:

src/app/src/app/child/grandchild.component.ts

所以我只需要打字

ng g c child/grandchild 

希望这对大家有所帮助

Ng g c组件名称

用于指定自定义位置:ng g c specific-folder/component-name

在这里,component-name将在specific-folder中创建。

类似的方法可以用于生成其他组件,如指令、管道、服务、类、保护、接口、枚举、模块等。

更短的代码来生成组件:ng g c component-name 指定它的位置:ng g c specific-folder/component-name

额外的信息 更短的代码生成指令:ng g d directive-name 指定它的位置:ng g d specific-folder/directive-name

Angular CLI提供了应用开发中需要的所有命令。对于您的特定需求,您可以轻松地使用ng g (ng generate)完成工作。

Ng c目录/component-name将在目录文件夹中生成component-name组件。

下面是您可以在应用程序中使用的一些简单命令的映射。

Ng g c comp-name或Ng generate component comp-name来创建一个名为'comp-name'的组件 Ng g s serv-name或Ng generate service serv-name来创建一个名为'serv-name'的服务 Ng g m mod-name或Ng generate module mod-name来创建一个名为'mod-name'的模块 Ng g m mod-name——routing或Ng generate module mod-name——routing来创建一个名为'mod-name'的模块,用于angular路由

希望这能有所帮助!

好运!