7

I am new in Angular, I am using Angular 4, and I made an app using the Angular CLI, by ng new command.

In main.ts, we have 

 ...
import {AppModule} from './app/app.module';
 .
 .
platformBrowserDynamic().bootstrapModule(AppModule);

and AppModule is defined (as you see) in app/app.module, here is what we have in app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

As you see it says export class AppModule { }, and it also used in platformBrowserDynamic().bootstrapModule(AppModule);

Can someone please explain this for me?

TypeScript Learner
  • 195
  • 3
  • 12

1 Answers1

10

The body of the class is indeed empty. But that decorator above the class (@NgModule) is giving that class its functionality. So really, that class isn't empty. It just doesn't require any extra logic after the decorator is applied to it. bootstrapModule takes a class as input and assumes that that class is decorated with @NgModule configured in a manner similar to what you have (declarations, imports, providers, etc.).

Jake Smith
  • 2,332
  • 1
  • 30
  • 68
  • I think your answer is incorrect. According to your answer decorator does all work for module class. And if so - we don't need use classes anymore. And in this case angular framework developers would not force us to use empty class! BUT: In fact we still have ability to use classes. And main question "WHY?". How can I use module class? I believe the @typescript-learner meant exactly that. – WebBrother Mar 27 '19 at 12:20
  • @WebBrother thanks for your ideas and thoughts. To clarify, I'm not insinuating that the class needs to be empty. I was explaining why the class in the code snippet presented in the question is empty. Decorators give your class behavior beyond what you have to define yourself. Of course you can add more to the class yourself after it has been decorated. In a lot of cases, one won't find themselves doing that. Runtime configuration is a situation that presents an exception to that. – Jake Smith Mar 27 '19 at 16:15
  • Can you provide an example of when module class is not empty? And how can I use methods and properties of ngModule class? – WebBrother Mar 29 '19 at 13:18
  • @WebBrother Here is an example of adding stuff inside one of your module classes: https://angular.io/guide/singleton-services#the-forroot-pattern – Jake Smith Nov 30 '20 at 04:15