Generating a Service

Available Schematics

The following schematics are available for use with the ng generate command:

• Class
• Component
• Directive
• Enum
• Guard
• Interface
• Module
• Pipe
• Service

Updating Unit Tests

After adding new components or services, you might need to manually update previously generated spec files in order to keep all of your tests passing.

For example, if you add a new component named MyTest to your app and update the app.component.html template to render that component, you'll need to update the app.component.spec.ts file in order to keep your unit tests passing. Just import your new component and add it to the test bed's declarations array.

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { MyTestComponent } from './new-test/new-test.component';
describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent,
        NewTestComponent
      ],
    }).compileComponents();
  }));
  it('should create the app', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.debugElement.componentInstance;
    expect(app).toBeTruthy();
  }));
  it(`should have as title 'app'`, async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.debugElement.componentInstance;
    expect(app.title).toEqual('app');
  }));
  it('should render title in a h1 tag', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
  }));
});

Custom Schematics

If the provided built-in schematics don't work for you, it's possible to configure the Angular CLI to use your own custom schematics. Here are a couple of resources that can help get you started.

• Creating Your Own Application Template for Angular CLI
• Angular DevKit Schematics

Additional Learning

• Setting Default Generate Values in Angular CLI Configuration