在Visual Studio IDE中创建/生成新的Angular组件的简便方法是什么？

Question

我正在使用ASP.NET Core项目 (Angular) 和Visual Studio作为我的IDE。

有没有一种简单的方法在Visual Studio中生成Angular组件文件并将新组件注册到应用程序模块中？

- Rahul Uttarkar

---

使用Angular CLI。 - Rahul Singh

Answer 1

只需在VS Code中打开终端并使用Angular CLI命令ng generate或其别名ng g。这是一些可以与ng g命令一起使用的选项列表：

• ng g c - 生成新组件
• ng g s - 生成新服务
• ng g d - 生成新指令
• ng g m - 生成新模块
• ng g p - 生成新管道

每个命令都需要一个参数（例如要生成的组件的名称）。要获取可用选项和参数的完整列表，请运行命令ng help generate或参考Angular CLI文档。以下是使用ng g命令的一些示例：

• ng g c product将为src/app/product目录下的新产品组件生成四个文件（.ts、.html、.css和.spec.ts），并将ProductComponent类添加到@NgModule的declarations属性中。

• ng g c product -is -it -spec=false将在src/app/product目录下生成一个单独的文件product.component.ts，其中包含内联样式和模板，并将ProductComponent添加到@NgModule的declarations属性中。

• ng g s product将在src/app目录下生成一个包含@Injectable()装饰器类的文件product.service.ts和文件product.service.spec.ts。

• ng g s product -m app.module将生成与上面命令相同的文件，并将ProductService添加到@NgModule的providers属性中。

- Yakov Fain

---

导航到组件文件夹并每次使用“ng g”命令生成将需要更多时间。那么使用Visual Studio IDE如何？ - Rahul Uttarkar

@YakovFain发布了整个CLI文档+1。这是生成快速组件的好方法。 - Rahul Singh

Rahul，我真的很遗憾我浪费时间回答你的问题。我得到了什么回报？指责我复制粘贴CLI文档。祝你好运。 - Yakov Fain

不确定为什么这被标记为答案，因为它提供了如何使用不同程序完成此操作的说明...... Visual Studio内部没有集成终端，但正在考虑，您可以在这里看到：链接。我建议的选项是：1）继续在Visual Studio内工作，并使用命令提示符生成组件，或者2）创建asp.net core与angular解决方案后，使用VS Code编写Angular部分（客户端应用文件夹）。 - FittyFrank

被踩是因为它与VS Code有关，问题实际上是关于Visual Studio IDE的。 - Adam Marshall

Answer 2

我从以下文章中找到答案： 使用Visual Studio 2017探索Angular基础知识 (我在VS 2019中进行了操作)

• 如果您还没有下载Angular模板，请下载：Angular Templates Extension
• 右键单击您的应用程序文件夹（或任何您想放置组件的位置）：添加 -> 新项目。
• 在右上角的搜索框中搜索Angular。
• 选择Angular组件。

- ModusPwnens