angular2-demo's Introduction

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:

NodeJS - Download and Install NodeJS
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

angular2-demo's People

Contributors

Stargazers

Watchers

angular2-demo's Issues

Local workspace file ('angular.json') could not be found.

After a successful npm install, ng serve fails:

$ ng serve --open
Local workspace file ('angular.json') could not be found.
Error: Local workspace file ('angular.json') could not be found.
    at WorkspaceLoader._getProjectWorkspaceFilePath (/usr/local/lib/node_modules/@angular/cli/models/workspace-loader.js:44:19)
    at WorkspaceLoader.loadWorkspace (/usr/local/lib/node_modules/@angular/cli/models/workspace-loader.js:31:21)
    at ServeCommand._loadWorkspaceAndArchitect (/usr/local/lib/node_modules/@angular/cli/models/architect-command.js:201:32)
    at ServeCommand.<anonymous> (/usr/local/lib/node_modules/@angular/cli/models/architect-command.js:53:25)
    at Generator.next (<anonymous>)
    at /usr/local/lib/node_modules/@angular/cli/models/architect-command.js:7:71
    at new Promise (<anonymous>)
    at __awaiter (/usr/local/lib/node_modules/@angular/cli/models/architect-command.js:3:12)
    at ServeCommand.initialize (/usr/local/lib/node_modules/@angular/cli/models/architect-command.js:52:16)
    at Object.<anonymous> (/usr/local/lib/node_modules/@angular/cli/models/command-runner.js:127:23)

angular-cli version issue

I am facing issue while running the "ng serve", it shows @angular-cli should be less than version (5.0.0)
Please suggest me how to run this application.

Thanks,
Chandan