https://angular.io/guide/what-is-angular#what-is-angular

Angular is a development platform based on TypeScript. It includes:

• component-based framework
• libraries, which covers a variety of features like routing, forms management etc.
• developer tools

A Component includes a TypeScript class with:

• @Component() decorator
• HTML-template
• styles

The HTML template declares how the component should be rendered. It can be done inline or by file path.

Inline:

@Component ({
  selector: 'hello-world',
  template: `<p>{{message}}</p>`
})

By file path:

@Component ({
  selector: 'hello-world',
  templateUrl: './hello-world-interpolation.component.html'
})

• Double curly braces ( {{}} )
  • indicate that the value should be interpolated

• Property binding ( [] )
  • sets values for properties and attribute of HTML elements

The following examples illustrates how the HTML attribute style.color can be bound to the TypeScript variable fontColor from the component class.

<p
  [id]="sayHelloId"
  [style.color]="fontColor">
  You can set my color in the component!
</p>

Event listeners can be declared with the help of parentheses:

<button
  type="button"
  [disabled]="!canClick"
  (click)="sayMessage()">
  Trigger alert message
</button>

The event listener calls the method sayMessage() which is defined in the component class.

Directives can be used to add features to the templates. For example:

• *ngIf
• *ngFor

It is also possible to declare own custom directives.

• in the class which should be injected
  • @Injectable declaration
• in the class which uses the injected functionality
  • import
    • e.g. import { Logger } from '../logger.service';
  • variable which uses the injected class
    • e.g.
      • declaration:
        • constructor(private logger: Logger) { }
      • and then using:
        • this.logger.writeCount(this.count)

• ng build → Compiles an Angular application into an output directory.
• ng serve → Builds and serves your application, rebuilding on file changes.
• ng generate → Generates or modifies files based on a schematic.
• ng test → Runs unit tests on a given project.
• ng e2e → Builds and serves an Angular application, then runs end-to-end tests.

• Angular Router → Advanced client-side navigation and routing based on Angular components. Supports lazy-loading, nested routes, custom path matching, and more.
• Angular Forms → Uniform system for form participation and validation.
• Angular HttpClient → Robust HTTP client that can power more advanced client-server communication.
• Angular Animations → Rich system for driving animations based on application state.
• Angular PWA → Tools for building Progressive Web Applications (PWA) including a service worker and Web application manifest.
• Angular Schematics → Automated scaffolding, refactoring, and update tools that simplify development at large scale.

• Getting started
  • …
• Adding navigation
  • …
• Managing data
  • …
• Using forms for user input
  • …
• Deploying an application
  • …

…