Angular 5 Basics

In this article, I ‘m going to give a basic introduction and the steps to project setup for Angular 5.

Angular 5 contains new features, performance improvements, and a log of bug fixes and many other things. A few of them are mentioned below.

  • Make AOT the default
  • Watch mode
  • Type checking in templates
  • More flexible metadata
  • Better error messages
  • Smooth upgrades
  • Hybrid Upgrade Application and many more.

New Features - Angular 5

  • Added an Options Arg to Abstract Controls in the form controls
  • Added add default updateOn values for groups and arrays to form controls
  • Added updateOn blur option to form controls
  • Added updateOn submit option to form controls
  • Added an Events Tracking Activation of Individual Routes
  • Added NgTemplateOutlet API as stable in the common controls etc.

Now, we are going to create an application in Angular 5.

Firstly, you have to download the latest version of Node from https://nodejs.org

Angular 5 Basics

Then, we need to install the Angular CLI to our project.

Angular CLI

Angular CLI is a command line interface to scaffold and build Angular apps using node.js style modules.

To install the Angular CLI to your project, open the Visual Studio Command Prompt or Visual Studio Code and move to the project folder path.

Angular 5 Basics

Now, install the Angular CLI to your project. To install it, run the below command.

npm install @angular/cli –global

Then, wait for a few seconds until the Angular CLI is installed. Then, to create an Angular app by executing this command -

ng new ASPNETCOREDEMO --skip-install.

All the Angular file will be added to our project.

Angular 5 Basics

Once you are done, execute the ng-serve command.

Angular 5 Basics

Then, open the mentioned localhost URL in the browser.

Angular 5 Basics

Once you're done, everything will look good. I hope this will help you.

The source code is attached.