If you want to see overall test coverage statistics than of course in Angular CLI you can just type, and see the bottom of your command prompt window
ng test --code-coverage
result:

if you want to see component's individual coverage of tests follow these steps.
npm install --save-dev karma-teamcity-reporterAdd
require('karma-teamcity-reporter')to list of plugins in karma.conf.jsng test --code-coverage --reporters=teamcity,coverage-istanbul
note that list of reporters is comma-separated, as we have added a new reporter, teamcity.
after running this command you can see the folder coverage in your dir and open index.html for a graphical view of test coverage.

You can also set the coverage threshold that you want to achieve, in karma.conf.js, like this.
coverageIstanbulReporter: {
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true,
thresholds: {
statements: 90,
lines: 90,
branches: 90,
functions: 90
}
},
Answer from ahmadalibaloch on Stack OverflowCode Coverage For Angular Templates?
angular 13: --code-coverage prints Coverage summary with Unknown%
How to get code coverage for Angular 16+ Jest
How do you measure code coverage on bitbucket?
Videos
If you want to see overall test coverage statistics than of course in Angular CLI you can just type, and see the bottom of your command prompt window
ng test --code-coverage
result:

if you want to see component's individual coverage of tests follow these steps.
npm install --save-dev karma-teamcity-reporterAdd
require('karma-teamcity-reporter')to list of plugins in karma.conf.jsng test --code-coverage --reporters=teamcity,coverage-istanbul
note that list of reporters is comma-separated, as we have added a new reporter, teamcity.
after running this command you can see the folder coverage in your dir and open index.html for a graphical view of test coverage.

You can also set the coverage threshold that you want to achieve, in karma.conf.js, like this.
coverageIstanbulReporter: {
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true,
thresholds: {
statements: 90,
lines: 90,
branches: 90,
functions: 90
}
},
First install the dependencies.
npm install karma karma-jasmine karma-chrome-launcher karma-jasmine-html-reporter karma-coverage-istanbul-reporter
Then run ng test.
ng test --code-coverage
Then run the server that shows you your report.
http-server -c-1 -o -p 9875 ./coverage
You should see something like this:

I wrote a blog post about this here.
Hello! I have done a decent amount of TDD-style coding on React projects where everything can be treated as a JavaScript function in some ways. We like to use the code coverage report as a tool to see where we are missing unit tests. The idea is that if you don't know what test to write next, just look at the code coverage report to see what still needs to be verified by automated tests.
With Angular though, a lot of the logic is moved to the HTML template files (ngIf, ngFor, etc). I am wondering if there is a way to have these html files show up on the code coverage reports for Angular? Is this a normal thing to do / want? Thanks!