angular 4

Angular 4 Online Training Institute in Ameerpet Hyderabad

On By In AngularJS Online Training in India

Angular 4 Online Training Institute in Ameerpet Hyderabad

We are providing Angular 4 Online Training in Ameerpet Hyderabad. We are one of best Institute to provide Best High Quality Angular 4 online training all over India. The IT Professionals and Students from India and abroad who are unable to attend regular classes can attend our Angular 4 online training from their home in their convenient timings. For more details on Angular 4 Online Training please call to 9290971883 / 9247461324, or drop a mail to revanthonlinetraining@gmail.com  or Whatsapp to us on : 9290971883

Angular 4 Course Content

Course Duration : 25 to 30 Hrs

Anatomy of an Angular 4 Application

  • Get the Most from This Course
  • Angular vs Angular 2 vs Angular 4
  • Sample Application
  • Course Outline
  • Selecting a Language
  • Selecting an Editor
  • Setting up Our Environment
  • Setting up an Angular 4 Application
  • Running an Angular 4 Application
  • About Modules
  • Loading ES Modules and Hosting Our Application

Introduction to Components

  • Introduction
  • What Is a Component?
  • Creating the Component Class
  • Defining the Metadata with a Decorator
  • Importing What We Need
  • Demo: Creating the App Component
  • Bootstrapping Our App Component
  • Demo: Bootstrapping Our App Component

Templates, Interpolation, and Directives

  • Building a Template
  • Building the Component
  • Using a Component as a Directive
  • Binding with Interpolation
  • Adding Logic with Directives: ngIf
  • Adding Logic with Directives: ngFor

Data Binding & Pipes

  • Property Binding
  • Handling Events with Event Binding
  • Handling Input with Two-way Binding
  • Transforming Data with Pipes

More on Components

  • Defining Interfaces
  • Encapsulating Component Styles
  • Using Lifecycle Hooks
  • Building Custom Pipes
  • Relative Paths with Module Id

Building Nested Components

  • Building a Nested Component
  • Using a Nested Component
  • Passing Data to a Nested Component Using @Input
  • Passing Data from a Component Using @Output

Services and Dependency Injection

  • How Does It Work?
  • Building a Service
  • Registering the Service
  • Injecting the Service

Retrieving Data Using HTTP

  • Observables and Reactive Extensions
  • Sending an HTTP Request
  • Exception Handling
  • Subscribing to an Observable

Navigation and Routing Basics

  • How Routing Works
  • Configuring Routes
  • Tying Routes to Actions
  • Placing the Views

Navigation and Routing Additional Techniques

  • Passing Parameters to a Route
  • Activating a Route with Code
  • Protecting Routes with Guards

Angular Modules

  • What Is an Angular Module?
  • Bootstrap Array
  • Declarations Array
  • Exports Array
  • Imports Array
  • Providers Array
  • Feature Modules
  • Shared Module
  • Revisiting AppModule

Form Basic in Angular 4

  • Reviewing the angular-seed Project
  • A Simple Form and ngForm
  • Shutting Off Browser Form Validation
  • Styling Forms and Text Input Using Bootstrap
  • Checkboxes
  • Radio Buttons
  • Select and Options
  • Browser Inconsistencies for Input Types

Data Binding in Angular Forms

  • Data Binding and ngModel
  • Creating a Model Object
  • Binding to Your Model
  • Calling a Method in Place of Binding
  • Calling a Method in Place of Binding
  • Binding a Checkbox
  • Binding Radio Buttons
  • Binding a Select Control

Form Validation

  • CSS Classes for Validation
  • CSS Validation Classes in Action
  • ngModel Validation Properties
  • Showing Error Messages
  • Styling Controls for Errors
  • HTML 5 Attributes for Validation
  • Validating a Select Control
  • More on Select Control Validation
  • Form Level Validation
  • Disabling the Submit Button

HTTP Form Posting and Data Access

  • Creating a Test Node Server
  • Creating an Angular Service to Post a Form
  • Handling a Form’s Submit Event
  • Validating the Form Before a Post
  • Setting up an Observable and a Subscriber
  • Posting to the Server
  • Handling a Server Error
  • Retrieving an ID From the Server
  • Loading Data from a Server
  • Dynamic Options for a Select Control

Third-party Form Controls

  • Setting up ng4-bootstrap
  • Datepicker
  • Timepicker
  • A Toggle Switch
  • Horizontal Radio Buttons

Angular 4 Setup Revisited

  • TypeScript Configuration File (tsconfig.json) & TypeScript Definitions File (typings.json)
  • npm Package File (package.json)
  • SystemJS Configuration File (systemjs.config.js)
  • index.html File Scripts
  • Bootstrapping Revisited
  • Angular CLI
  • Recapping Our Journey