如何在Angular 6的文件夹内创建组件

时间:2018-08-18 07:12:19

标签: angular angular6

我在下面附加了我的角度项目的文件夹层次结构:

enter image description here

如您所愿。我的应用程序文件夹位于_component文件夹下。另外,我的其他ts文件(如auth)位于_auth文件夹下,接口位于_model文件夹等内。

您,当我执行ng g c componentName命令时,它将在根目录中创建应用程序文件夹,并在其中创建组件。所以我必须转到特定的文件夹,然后再执行命令。

enter image description here

我的问题是,无论如何,我是否可以直接从根文件夹创建组件。像ng g c _component/MycomponentName

已更新:
我还尝试了其他方法来创建它,如下所示:
enter image description here enter image description here

4 个答案:

答案 0 :(得分:1)

这是正常命令,将在项目根目录中运行。

ng g c path/to/name

但是由于您的项目结构非标准,ng无法找到应在其中导入新组件的NgModule。因此,您既可以使用--skip-import选项,也可以使用--module path/to/your/app/module选项并将ng指向正确的文件

答案 1 :(得分:0)

最好将您的项目结构更改为这样的标准角度项目结构。enter image description here

然后您可以生成新的组件,通过终端并输入相关位置

  

ng g c 组件名称

答案 2 :(得分:0)

how to create Component inside folder in Angular example with image

ANS : ng 生成组件 auth/reset-password

答案 3 :(得分:0)

您可以更好地使用以下文件夹结构并摆脱该错误,以便您可以 相应地创建模块和组件。

-app
  
-shared
  -services
  -pipes
  -components
  -models

-modules_folder
  -module_A
    -components_folder
        -component_A.component.ts
        -component_A.component.html
        -component_A.component.css            
    -models_folder
        -model_A.model.ts
    -services_folder
        -service_A.service.ts

    -module_A.component.ts 
    -module_A.component.html
    -module_A.component.css
    -module_A.module.ts        
    -module_A-routing.module.ts  

-app.component.ts
-app.component.html
-app.component.css
-app.module.ts
-app-routing.module.ts

以上文件夹结构给出了一种微服务架构,其中每个模块都有自己的服务/依赖项。