NgModule and the root module - lordoftheflies/angular-essential-training GitHub Wiki

Selecting transcript lines in this section will navigate to timestamp in the video

• [Instructor] Angular leverages decorators to help configure code like classes, methods, and fields. A decorator is an expression that evaluates to a function that makes it possible to annotate and modify code at design time. Angular has a bunch of decorators it provides in the platform. TypeScript provides support for decorators through its transpiler. The syntax for using a decorator is the @ symbol followed by the decorator name and then a pair of parentheses. What you put in the parentheses depends upon the decorator. An Angular application starts with an Angular module which gets configured using a decorator. Angular modules help to keep application code organized by blocks of functionality and features. A root module acts as the starting point module for an Angular application. We will begin by creating the root module class in a file named app.module.ts that is in the source/app folder of the project. We need to use a decorator to annotate that class so Angular will know it's an Angular module. To inform Angular that the class code in here is intended to be an Angular module, you need to decorate it with the NG module decorator. Angular exports the NG module decorator from its core scoped package. To use the decorator from the package, you need to import it using the module loading syntax that TypeScript supports. You start with the keyword import followed by a space and a pair of curly braces. Inside the curly braces, you list the types that you want to import. We want to import the NG module decorator, so I will put that inside the curly braces. You can import more than one type from a module by adding a comma after each. We don't need to do that right now, but I will cover that in a later lesson.