Skip to main content

What's New in Angular 9? Angular 9 New Features

Angular 9 is the smaller, faster, and easier to use and it will be making Angular developers life easier. The fully version of Angular 9 will be released in the month of October/November 2019.

Explore this: Angular 9 vs. Angular 8 vs. Angular 7 vs. Angular 6, 5, 4, 2

Added Angular 9 Features -
1.      Added undecorated classes migration schematic in the core.
2.      The formControlName also accepts a number in the form
3.      Now allow selector-less directives as base classes in View Engine in the compiler.
4.      Added support selector-less directive as base classes in Ivy and also make the Ivy compiler the default for ngc.
5.      Convert all ngtsc diagnostics to ts.Diagnostics
6.      bazel: support ts_library targets as entry-points for ng_package.
7.      core: add dynamic queries schematic.
8.      core: Mark TestBed.get as deprecated.
9.      ivy: expose window.ng.getDebugNode helper and also support ng-add in localize package.
10.  ivy: i18n – add syntax support for $localize metadata block.
11.  ivy: i18n – reorganize entry-points for better reuse.
12.  language-service: enable logging on TypeScriptHost.
13.  language-service: provide diagnostic for invalid templateUrls.
14.  language-service: provide diagnostics for invalid styleUrls.

DEPRECATIONS -

core: TestBed.get function is marked as deprecated, use TestBed.inject instead.

Performance Improvements :



  1. Binding update benchmark and also convert all node-based benchmark to use a testing harness.
  2. Avoid megamorphic reads during property binding.
  3. Avoid repeated lview reads in pipe instructions.
  4. Avoid repeated LView reads in property instructions.
  5. Avoid unnecessary DOM reads in styling instructions.
  6. Initialise TNode inputs / outputs on the first creation pass for the Ivy.
  7. limit TNode.outputs reads for the ivy.

8. The language-service, keep analyzedModules cache when source files don't change.

It looks like -
describe('TypeScriptServiceHost', () => {
  it('should not clear caches when external template changes', () => {
    const tsLSHost = new MockTypescriptHost(['/app/main.ts'], toh);
    const tsLS = ts.createLanguageService(tsLSHost);
    const ngLSHost = new TypeScriptServiceHost(tsLSHost, tsLS);
    const oldModules = ngLSHost.getAnalyzedModules();
    tsLSHost.override('/app/test.ng', '<div></div>');
    const newModules = ngLSHost.getAnalyzedModules();
    expect(newModules).toBe(oldModules);
   });

});

Angular 9 Breaking Changes -

1) Ivy applications :- 
Previously, in Ivy applications, Hammer providers were included by default. With this commit, apps that want Hammer support must import HammerModule in their root module i.e.

import {HAMMER_PROVIDERS} from './dom/events/hammer_gestures'

2) ServiceWorker: 
Remove deprecated option versionedFiles from service worker asset group configuration in ngsw-config.json

Before

"assetGroups": [

  {
    "name": "test",
    "resources": {
      "versionedFiles": [
        "/**/*.txt"
      ]
    }
  }
]

After

"assetGroups": [
  {
    "name": "test",
    "resources": {
      "files": [
        "/**/*.txt"
      ]
    }
  }
]

Angular 9 Bug Fixes -

common: update $locationShim to notify onChange listeners before emitting AngularJS events.

compiler: return enableIvy true when using readConfiguration
ivy -
1.      Get name directly from nativeNode
2.      Handle empty bindings in template type checker
3.      In ngcc, handle inline exports in commonjs code
4.      The ngcc should only index .d.ts exports within the package
5.      The ngTemplateOutlet error when switching between null and template value

language-service -
1.      Instantiate MetadataResolver once
2.      Remove 'context' used for module resolution
ngcc -
1.      Handle deep imports that already have an extension

2.      Ignore format properties that exist but are undefined

Reference link - https://github.com/angular/angular/blob/master/CHANGELOG.md


Compatibility note: The primary goal of the backward compatibility promise is to ensure that changes in the core framework and tooling don't break the existing ecosystem of components and applications and don't put undue upgrade/migration burden on Angular application and component authors.

Note: Angular versions ^4.0.0 and ^5.0.0 are no longer under support.
By Anil Singh | Rating of this article (*****)

Popular posts from this blog

List of Countries, Nationalities and their Code In Excel File

Download JSON file for this List - Click on JSON file    Countries List, Nationalities and Code Excel ID Country Country Code Nationality Person 1 UNITED KINGDOM GB British a Briton 2 ARGENTINA AR Argentinian an Argentinian 3 AUSTRALIA AU Australian an Australian 4 BAHAMAS BS Bahamian a Bahamian 5 BELGIUM BE Belgian a Belgian 6 BRAZIL BR Brazilian a Brazilian 7 CANADA CA Canadian a Canadian 8 CHINA CN Chinese a Chinese 9 COLOMBIA CO Colombian a Colombian 10 CUBA CU Cuban a Cuban 11 DOMINICAN REPUBLIC DO Dominican a Dominican 12 ECUADOR EC Ecuadorean an Ecuadorean 13 EL SALVA...

nullinjectorerror no provider for httpclient angular 17

In Angular 17 where the standalone true option is set by default, the app.config.ts file is generated in src/app/ and provideHttpClient(). We can be added to the list of providers in app.config.ts Step 1:   To provide HttpClient in a standalone app we could do this in the app.config.ts file, app.config.ts: import { ApplicationConfig } from '@angular/core'; import { provideRouter } from '@angular/router'; import { routes } from './app.routes'; import { provideClientHydration } from '@angular/platform-browser'; //This (provideHttpClient) will help us to resolve the issue  import {provideHttpClient} from '@angular/common/http'; export const appConfig: ApplicationConfig = {   providers: [ provideRouter(routes),  provideClientHydration(), provideHttpClient ()      ] }; The appConfig const is used in the main.ts file, see the code, main.ts : import { bootstrapApplication } from '@angular/platform-browser'; import { appConfig } from ...

Top 15+ Angular 17 Interview Questions Answers | For Experienced Professionals as well

G Google team released the latest version of Angular – Angular 17 on November 6, 2023, creating a significant milestone for the super fast front-end development. What Are the New Features in Angular 17? 1.       Angular 17 is the highly anticipated release for the community, bringing many new exciting features, updates, and improvements. 2.       New Syntax for Control Flow in Templates - new @if, @switch, @for, @case, @empty @end control flow syntax 3.       Deferred Loading - @defer partial template 4.       The Angular signals API 5.       Angular SSR and client hydration 6.       Automatic Migration to Build-in Control Flow 7.       Build Performance with ESBuild 8.       By default, set this newly generated component as a standalone, and now we don't have an app module file. To use (ng...

SOLID-Liskov Substitution Principle (LSP) Real-Time Example in C#

The SOLID Principles are the design principles that enable us to manage several software design problems. These principles provide us with ways to move from tightly coupled code to loosely coupled and encapsulated real business needs properly. Also readable, adaptable, and scalable code. The SOLID Principles  guide developers as they write readable, adaptable, and scalable code or design an application. The SOLID Principles can be applied to any OOP program. The SOLID Principles were developed by computer science instructor and author Robert C. Martin. Now, SOLID principles have also been adopted in both agile development and adaptive software development. The 5 principles of SOLID are: 1.       Single Responsibility Principle (SRP) 2.       Open-Closed Principle (OCP) 3.       Liskov Substitution Principle (LSP) 4.       Interface Segregation Principle (ISP) 5. ...

Angular 2, 4, 5, 6, 7, 8 and 9 Interview Questions and Answers -Books

» Are you preparing for Angular Interview? Buy this book (Including Angular 8, 7, 6, 5,4, 2) Interview Q/A Interview Q/A Interview Q/A Interview Q/A Interview Q/A Interview Q/A Interview Q/A » A Complete Guide Book of Angular 9 This is a concise, complete overview of the key aspects of Angular 9. It is fully up to date with the latest release of Angular. This article provide all the important aspects required for angular developers looking for brief and useful content... Posted In Angular 9 » A Complete Guide Book of Angular 8 This is a concise, complete overview of the key aspects of Angular 9. It is fully up to date with the latest release of Angular. This article provide all the important aspects required for angular developers looking for brief and useful content... Posted In Angular 8 » A Complete Guide Book of Angular 7 This is a concise, complete overview of the key aspects of Angular 7. It is fully up to date with the latest release of Angular. This ...