Angular code examples

Angular Code examples

When I start an angular application, I prefer to use VS Code and I usually begin with the CLI.

My Angular code examples starts with the app.module.ts file.

import { BrowserModule } from '@angular/platform-browser';

import { NgModule } from '@angular/core';

import { HttpClientModule } from '@angular/common/http';

import { RouterModule } from '@angular/router';

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

import { WelcomeComponent } from './home/welcome.component';

import { ProductModule } from './products/product.module';

@NgModule({

declarations: [

AppComponent,

WelcomeComponent

],

imports: [

BrowserModule,

HttpClientModule,

RouterModule.forRoot([

{ path: 'welcome', component: WelcomeComponent },

{ path: '', redirectTo: 'welcome', pathMatch: 'full' },

{ path: '**', redirectTo: 'welcome', pathMatch: 'full' }

]),

ProductModule

],

bootstrap: [AppComponent]

})

export class AppModule { }

This is the app.component.ts file

// The component's import, this imports the members we need

import { Component } from '@angular/core';

// The component's decorator that defines the metadata & template

@Component({

selector: 'pm-root',

template: `

<a class='navbar-brand'>{{pageTitle}}</a>

<li><a class='nav-link' [routerLink]="['/products']">Product List</a></li>

</ul>

</nav>

<router-outlet></router-outlet>

</div>

`

})

// The component's class

export class AppComponent {

pageTitle: string = 'Acme Product Management';

}