Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Angular 2-7 notes


*ng new project name

  • ng g c folder/module-folder-name --spec false




import { Routes } from "@angular/router";

const appRoutes: Routes = [
  { path: '', component: Index, }
  { path: 'register', component: , }
  { path: 'register', component: , }

ng g module collector

ng g c collector/donors --module=collector --spec false

ng g c donors/register --module=donors --spec false

Notes from

Alain Chautarde. @AlainChautard

AhgularJS was (1.x) from 2012 to 2016 - Releases from time to time

Ahgular JS era (2.x) - Celar, predictable schedule New version on every 6 months;

2.0, 4.0, 5.0 - 2017 6.0, 7.0 8.0 - 2018

Support per 1 year and half; All major version have a 1 year LTS after inital 6 months; Minor version every month; Path version happen every week;

Some projects: Angular CLI, Angular NX, Angular Fire,



Depency Injectable;

@componsen({ providers: [LoggingService] })

Data Service

Hierarchical Injecto

AppModule - providers: [];

AppComponent - providers: [];

Any other Component - providers: [];

@Injectable() - from @angular/core

Using services for Cros-component Communication

statusUpdated = new EventEmitrrer();


String interpolation

{{ propertieName }} {{ methodName() }} {{ 'propertieName' }}

Property binding


String interpolatio vs Property binding

To show data use String interpolation {{}}

To reference property use property binding []

Event Binding


Important: FormsModule is Required for Two-Way-Binding!

Seção 2, aula 29 Important: For Two-Way-Binding (covered in the next lecture) to work, you need to enable the ngModel directive. This is done by adding the FormsModule to the imports[] array in the AppModule.

You then also need to add the import from @angular/forms in the app.module.ts file:

import { FormsModule } from '@angular/forms';

Two ways data binding

<input type="text" [(ngModel)]="propertyName" />




Instructions in the DOM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment