Angular Visual Studio删除嵌套组件

Question

I'm very new to Angular, coming from a Web Forms background. I Set up an Angular project in Visual Studio and going through tutorials. I'm trying to delete a component. I've removed all references to it in app.module.ts and app.component.ts and deleted the .js, .ts files for the component. When I run the project the console error states my deleted component is not a known element. How do you get rid of a component using Visual Studio? I also removed some html in the template and the browser still renders it.

Answer 1

Welcome to StackOverflow !

This happens because your app stills try to register your component in your module.

To fix that, open your app.module.ts , and remove all occurences of component you want to delete.

You should remove :

• import line ( import { Component } from ./your-component )
• component in your NgModule imports ( @NgModule({ imports: [ ... ] }) )

Answer 2

Make sure that in the app.module.ts you removed the import statement AND the name of the component in the declaration section of @NgModule.

When you say you removed the files, I'm assuming you removed the folder. Check that as well.

Other than that, you can go to the "Error list" and see what's lines are causing the error and remove them.

Side note: I also came from a Web Forms background and after I learned Angular a few months ago and I fell in love with it! Web Forms never again. The productivity difference for me was astronomical. Keep up! Angular is not easy at first but when you get used to it you will build web applications in a really productive manner. If you're starting a project, I recommend you to check out PrimeNG if you haven't done so. They have really good components and it's easy to implement.