Skip to content
A Fully Functional Angular 2 Demo application
Branch: master
Clone or download
luixaviles Merge pull request #4 from luixaviles/upgrade
Upgrade to latest Angular version
Latest commit dce2dd6 Sep 28, 2018

README.md

A Fully Functional Angular 2 Demo Application

Slides: https://luixaviles.github.io/angular2-demo/

Updates

NOTE: Project updated to latest Angular version: 6.1.9.

I decided to update this project since a lot of people arrived here from Google and other sources. Keep in mind you should use "Angular" to describe versions 2+ of the framework: It's just Angular ;-)

I wrote this demo for a tech talk in July, 2016.

Support this project

  • Star GitHub repository ⭐️
  • Create pull requests, submit bugs or suggest new features
  • Follow updates on Twitter or Github

Description

This demo is based on puppy-love project. The features of this project includes:

  • A Service definition, so that HTTP calls can be performed to display initial data.
  • A custom model definition, to allow map used data.
  • Dependency Injection.
  • Two way data binding(Using [(ngModel)]).
  • Use of *ngIf and *ngFor into provided form.
  • Events triggering after click on a button. (click)
  • Use of Material Design components for Angular 2

The app uses Random user Generator to show initial data. This demo was presented in Google I/O Extended event in Cochabamba, Bolivia(July, 2016).

Screenshots

Prerequisites

First, ensure you have the following installed:

  1. NodeJS - Download and Install NodeJS
  2. Git - Download and Install Git

After that, use Git bash to run all commands if you are on Windows platform.

Install dependencies

Install Angular CLI:

npm install -g @angular/cli

For more details about Angular CLI, please refer to: https://cli.angular.io/

Run the project

To run the demo project locally, just install dependencies and run the application in development mode:

$ npm install
$ ng serve -o

Now you can open your browser and load http://localhost:4200

Try the code, verify the current behavior. Update the code and configurations and test again!

Please feel free to contact me if you have any question.

License

MIT

You can’t perform that action at this time.