Angular Js Tutorial

Refer this video (

Install Angular Js in system
Run the following commands

npm install -g @angular/cli
ng new a4app

Intall angular js extension for visual studio (Angular 6 snippets)

ng serve


Note : angular-cli.json has now been changed to angular.json on angular 6

Go to

  1. src/app/app.component.html (Clear all the text)
  2. src/app/app.component.ts (Make as below)
    1. export class AppComponent {
      //title = ‘app’;
  3. Create folder src/app/components.
  4. ng g component components/user (4 files are created in user folder)
  5. Also there is line `import { UserComponent } from ‘./components/user/user.component’;` created in src/app/app.module.ts

Actual Lesson Starts Now

  1. Go to src/app/app.component.html and type `<app-user></app-user>`
  2. Go to user.component.html and type `<h1>Hello World</h1>`
  3. In  user/user.component.ts write as

export class UserComponent implements OnInit {
name = "John Does";
constructor() { }

ngOnInit() {


4.Go to user.component.html and type `<h1>Hello {{name}}</h1>`

ng g service services/data
Share on Facebook0Tweet about this on Twitter0Share on Google+0Pin on Pinterest0Share on LinkedIn0Share on Reddit0
It's only fair to share...

Add Comment

Required fields are marked *. Your email address will not be published.