One of the most useful aspects of the Angular framework is the Angular CLI. The Angular CLI is a powerful tool that can help automate a variety of tasks. These tasks range from updating your project's Angular version to creating a new Angular component or service. In a real Angular app, the Angular CLI will save you a lot of time by creating app boilerplate for you.
In this guide, you will learn how you can use the power of the Angular CLI to generate a new Angular service inside of your project.
The Angular CLI can be downloaded onto your machine by running the following command using NPM:
1 npm install -g @angular/cli
The Angular CLI is an abstraction layer that is powered under the hood by a library called Schematics. Through the power of Angular Schematics' scaffolding capabilites, the Angular CLI exposes a number of commands. You can generate a new Angular application by running the following:
1 ng new my-new-app
This command will create a new Angular application within your current directory named
my-new-app. Now that you have generated a new application, let's look at how use the Angular CLI to generate a new service for your application.
According to the Angular CLI service Schematics' schema.json, the following options are available to use:
name: A required, positional option that specifies the name of the service
path: An optional path at which to generate the new service
project: An optional project name that maps to a project located inside of the
flat: An optional flag that ensures that the generated service is created at the root level of the Angular project
skipTest: Ensures that the schematic does not generate a
lintFix: An optional flag that, when set to
tslintlinting fixes to the generated service
Most of these options are fairly self-explanatory. The most commonly used options are
name (which is required) and
name option is a required, positional argument that is used primarily like this:
1 ng generate service my-test
The command above will generate a new service named
MyTestService within your current directory.
path option allows you to specify an absolute path at which to generate the new service. This can be an existing path or a new path.
1 ng generate service another --path=app/core
The above command will generate a new service named
AnotherService located at
app/core/another.service.ts—regardless of your current working directory.
Another useful option,
lintFix, can come in handy when your team's Angular project has highly customized
tslint rules. Because the
lintFix option works with
tslint, you must have
tslint installed as a development dependency in your
node_modules folder. Using this option is as simple as:
1 ng generate service birds --path=app/core --lintFix
You have now learned how to easily generate a new service within your Angular application or library. You have also learned all of the options that are available to the service schematic. With the help of these available schematic options, you now know that you can easily generate a new service without the default
.spec file or at any path of your choosing.