NgModule decorator identifies AppModule as a NgModule class. Such that the NgModule takes a metadata object that tells Angular how to compile and launch the application.

Some of the important NgModule metadata properties are – providers, declarations, imports, exports, entryComponents, bootstrap, schemas and id

Zones are a type of performance setting that empowers us to catch into our anachronistic tasks.

Primarily, Zones in angular APIs helps to increase the performance by executing our code exterior to the angular zone. Also Zone helps in preventing Angular from the governing unwanted alter detection assignments

The Angular Team are working on lots of bug fixes, new features and added/update/remove/ re-introduce/ and many more things.

Changes of Angular 6 can be explored step by step:
Included ng update - This CLI commands will update your angular project dependencies to their latest versions. The ng update is normal package manager tools to identify and update other dependencies.

AppModule is identified as NgModule class by the module director.
The NgModule takes a metadata object that instructs the Angular to how to compile and launch the application.
The NgModule importance metadata properties are:-

• providers
• declarations
• imports
• exports
• entryComponents
• bootstrap
• schemas
• id

There are four types of NgModules –

• Features Module
• Routing Module
• Service Module
• Widget Module
• Shared Module

When a pure change to the input value is detected then only Angular executes a pure pipe. A pure change can be primitive or non-primitive.

Primitive data are only single values, and they do not possess any special capabilities and the non-primitive data types are used to store the group of values.

@Pipe({name: 'currency'})

During every component change detection cycle, Angular executes an impure pipe. An impure pipe is called frequently, as frequent as every keystroke or mouse-move.

An Id if you want to make a pipe impure that time you will allow the setting pure flag to false.
@Pipe({ name: 'currency', pure: false })

In order to achieve the output a pipe can accept any number of optional parameters. Any valid template expressions, can be the parameter value. Follow the pipe name with a colon (:) to add optional parameters. It looks like- currency: 'INR'

In the following example–

The birthday is - {{ birthday | date:"MM/dd/yy" }}

To perform the multiple operations within the single expression the chaining Pipe is used. This chaining operation will be chained using the pipe (I). In the following example, to display the birthday in the upper case- will need to use the inbuilt date-pipe and upper-case-pipe.

In the following example –
{{ birthday | date | uppercase}}

• BrowserModule – The browser module is imported from @angular/platform-browser and it is used when you want to run your application in a browser.
• CommonModule – The common module is imported from @angular/when you want to use directives common and it is used - NgIf, NgFor and so on.
• FormsModule – The forms module is imported from @angular/forms and it is used when you build template driven forms.
• RouterModule – The router module is imported from @angular/router and is used for routing RouterLink, forRoot, and forChild.
• HttpClientModule –The HttpClientModule is imported from @angular/common/http and it used to initiate HTTP request and responses in angular apps. The HttpClient is more modern and accessible to use the alternative of HTTP.

Angular does not need node.js directly. For all the build and development tools, Node js is used.

Angular is a framework and to program using Angular you may use typescript or javascript or dart programming language.

• Develop Single Page applications Angular is a perfect framework.
• Service Worker Support. Basically service workers are the scripts which run in the web browser and manage to cache an application.
• Template Element.
• i18n.
• Ivy New Rendering Engine.
• ngModelChange.
• ElementRef
• Basel Compiler.

Angular is a platform and framework for building client applications in HTML and TypeScript.

NgModules collect related code into functional sets; an Angular app is defined by a set of NgModules. An app always has at least a root module that enables bootstrapping, and typically has many more feature modules.

Angular 6 was released on May 4th, 2018.

The highlights of Angular 6 include The Component Development KIT (CDK), the Angular Command Line Interface (CLI), and the Angular Material package update.

• Add the new CLI. npm install @angular/cli@latest -g.
• Upgrade the CLI locally in your project. ng update @angular/cli.
• Upgrade Angular dependencies.
• Upgrade Angular dev dependencies.
• Upgrade Angular dependent dependencies.
• Upgrade Angular dependent dev dependencies.
• Install TypeScript 2.7.2.
• Install RxJS 6+

Angular 6 also includes two very important superpowers to the CLI: Schematics and Libraries.

Schematics permits you to reduce your boilerplate code to a custom schematic that you can create for your own modules and components. While, the new library generator makes it much easier to contribute open-source modules.

My advice is to use the Angular CLI, If for your next project you choose Angular.

The Angular CLI is only a wrapper around Webpack. And especially when you are not a Webpack and Angular expert. But be prepared, that there is a very low chance that Angular CLI will not stay with your project until the end.

Angular is a modern framework built entirely in TypeScript, and as a result, a seamless experience is provided by using Typescript with Angular.

The TypeScript isn't only used as a first-class citizen, but supported as the primary language by the Angular Documentation.

Angular 2 and Angular 4 both are the enhanced size of AoT or ahead-of-time and have compiler generated code.

Due to compiler generated code, Angular 4 has become smoother and swift when compared to the Angular JS 2. Angular 2 supports TypeScript 1.8 version, whereas Angular 4 supports typescript 2.1 and 2.2 versions.

Angular6 is a Open source Javascript framework, to develop dynamic web applications.

Angular 6 eases development of web application as it uses HTML like syntax to declare various functionality of a web application.

Angular 6 features

• Released on April 2018
• Improvements in tool-chain
  
• removed <template> tag with “<ng-template>”
  
• Changed Registering provider
• Changes in ngModelChange event
  
• ng update <package> command in CLI for app update
• ng add command in CLI for new capability to add to app
• complete support of Angular Elements to create an Angular component and publish it as  web component
• supports configuration of navigation URLs within the Service Workers
• i18n is with runtime rendering
• New rendering engine added - Ivy
• Bazel compiler support
• RxJS 6.0 support
  
  

Angular6 is a open source Javascript framework, to develop dynamic web software applications.

Angular6 is used for

• is used to develop single page applications or SPA.
• Makes it easy to build web Single Page Applications.
• publish web component
• Using Component Development Kit or CDK to build own UI components library
• supports for Responsive Web Design.
• Has Angular Command Line Interface (CLI) with ng-update and ng-add command
• Use Angular Material Design Library to visualize tree structures in hierarchical order.
• Use Bazel Compiler which offers optimized dependency, distributed caching, parallel execution,
• Use Closure Compiler to build minimum JavaScript modules
• Has Ivy Renderer
  
  

Create a project in angular 6 by using Angular 6 CLI as

ng new project-name

A project structure is created.

NPM in angular is used for package management.

Angular framework and CLI are NPM packages and distributed by NPM registry.

NPM expands to Node Package Manager and is the default package manager for Node.js.

Observables in Angular 6 are placeholder or an interface for asynchronous operations using RxJS.

It is like an subscription such that we process or take action, if something happens.

Angular's http client library returns observables by default. With reactive programming (like rxJS) we can make observables out of events like click events.

The HTTP module uses observables to handle AJAX requests and responses. We can define custom events that send observable output data from a child to a parent component.

Angular 6 features

• Improvements in tool-chain
  
• removed <template> tag with “<ng-template>”
  
• Changed Registering provider
• Changes in ngModelChange event
  
• ng update <package> command in CLI for app update
• ng add command in CLI for new capability to add to app
• complete support of Angular Elements to create an Angular component and publish it as  web component
• supports configuration of navigation URLs within the Service Workers
• i18n is with runtime rendering
• New rendering engine added - Ivy
• Bazel compiler support
• RxJS 6.0 support

Angular 7 is open source Javascript framework.

Angular 7 features

• Released on Oct, 2018
• Angular 7 supports Typescript 3.1, RxJS 6.3 and Node 10.
• CLI Prompts helps users to explore the in-built SCSS support, routing, etc.
• Increased application performance by to automatically removing reflect-metadata from polyfills.ts file
• Has virtual scrolling to bind a long list of elements in small packets
• Support for dragging and dropping items in the list using CDK
• Can set up a budget limit of final bundle size default lower limit is 2MB and higher is 5 MB
• updates in Angular Elements
• support for Node 10, TypeScript3.1, and the RxJS6.3
• Angular 7 offers Do-Bootstrap and ngDoBootstrap
• @Output has better error handling
  
  

• Set Up the Development Environment. For building an Angular 2 project, you need to have the Angular CLI (command line interface). 
• Create a New Project. Open a terminal window. ...
• Serve the Application. Go to the project directory and install node modules in your project directory.

Installing angular from NPM, is done by installing from Angular CLI.
Angular CLI needs Node.js as it is available as NPM package.

Steps to installing angular from NPM, are

• Check Node.js is installed by giving the command – node –v
• Install Angular CLI by command - npm install -g @angular/cli
• Angular is installed, create new project by command - ng new <project or app name>

Angular, the Angular CLI, and Angular apps depend on features and functionality provided by libraries that are available as npm packages.

Subscribe is an method in RxJS library and is used with observables.

The subscriber function defines how to obtain or generate values or messages to be published.

You create an Observable instance that defines a subscriber function, which is called  when a consumer calls the subscribe() method

To execute the observable you have created and begin receiving notifications, you call its subscribe() method, passing an observer. This is a JavaScript object that defines the handlers for the notifications you receive. The subscribe() call returns a Subscription object that has an unsubscribe() method, which you call to stop receiving notifications.

Observables in Angular 7 are placeholder or an interface for asynchronous operations using RxJS.

It is like an subscription such that we process or take action, if something happens.

Angular's http client library returns observables by default. With reactive programming (like rxJS) we can make observables out of events like click events.

The HTTP module uses observables to handle AJAX requests and responses. We can define custom events that send observable output data from a child to a parent component.

Use of subscribe in angular 6, is done with usage of observables inn Angular 6.

Subscriber function defines how to obtain or generate values or messages to be published.

Subscribe is a method in RxJS library and is used with observables.

You create an Observable instance that defines a subscriber function, which is called  when a consumer calls the subscribe() method.

To execute the observable, you call its subscribe() method, passing an observer. The subscribe function returns a Subscription object with an unsubscribe() method for stopping the notifications.

Promise in Angular, is used with asynchronous tasks.

Promises return only a single value as

• data or output if promise resolves
• or error message if promise rejects

Request initiated by a promise is not cancellable. Promise was added in Angular from Angular 2.
An observable in comparison, handles multiple events similar to a stream.

RxJS in angular is a library for reactive programming using observables to easily compose asynchronous or callback-based code.

RxJS in Angular, gives an implementation of the Observable type.

RxJS expands to Reactive Extensions for JavaScript.

RxJS in Angular also gives many utility functions for creating and working with observables, like

• Converting existing code for async operations into observables
• Iterating through the values in a stream
• Mapping values to different types
• Filtering streams
• Composing multiple streams
  
  

HttpClient in Angular, is an client HTTP API.

HttpClient in Angular, is in @angular/common/http for Angular applications using the XMLHttpRequest interface.

HttpClient provides benefits to Angular, as HttpClient has

• testability features
• typed request and response objects
• request and response interception
• Observable apis
• streamlined error handling