Search⌘ K
Home
Courses
The Angular Masterclass

Categories of Metadata Used by @NgModule Decorator

Explore the three core categories of metadata in Angular's NgModule decorator: static for selector templates, runtime for dependency injection of services, and composition for module organization. Understand how they enable scalable app structure and service management.

We'll cover the following...

Categories of metadata

When the Angular CLI creates a new application, it generates a single NgModule file for us. This file is always called app.module.ts and looks like this:

import { AppPage } from './app.po';
import { browser, logging } from 'protractor';

describe('workspace-project App', () => {
  let page: AppPage;

  beforeEach(() => {
    page = new AppPage();
  });

  it('should display welcome message', () => {
    page.navigateTo();
    expect(page.getTitleText()).toEqual('Client-Contacts-Manager-Angular app is running!');
  });

  afterEach(async () => {
    // Assert that there are no errors emitted from the browser
    const logs = await browser.manage().logs().get(logging.Type.BROWSER);
    expect(logs).not.toContain(jasmine.objectContaining({
      level: logging.Level.SEVERE,
    } as logging.Entry));
  });
});
app.module.ts file in Angular

There isn’t a lot going on here. There aren’t any functions, events, or loops in the main AppModule class. Everything is within the @NgModule decorator. ...