© 2019 NewAge SMB
Getting Started With Angular 6.0

Getting Started With Angular 6.0
06 June, 2018

Angular has released its latest version, Angular 6.0. Let’s have a quick round look at the new features of Angular 6.0.


What's New in Angular 6.0?


  • ng update: A new CLI command that will update the project dependencies to the latest versions.

  • ng add: Another new CLI command that will make adding new capabilities to the project easier.

  • Angular Elements: This is a new feature that allows to compile Angular components to native web components which can be used in the Angular app.

  • element is deprecated: You can't use anymore inside of the component templates. The developer need to use instead.

  • Angular CLI now has support for creating and building libraries. To create a library project within the CLI workspace, run the following command:

    • ng generate library

    • For example:ng generate library my-demo-lib

  • Angular Material Starter Components: If run ng add @angular/material to add material to an existing application, the developer will also be able to generate three new starter components.

    • Material Sideman A starter component including a toolbar with the app name and the side navigation.

    • Material Dashboard A starter dashboard component containing a dynamic grid list of cards.

    • Material Data Table A starter data table component that is pre-configured with a datasource for sorting and pagination.

  • Angular CLI now has support for workspaces containing multiple projects, such as multiple applications and/or libraries.

  • The ".angular-cli.json" file has been deprecated. Angular projects will now use "angular.json" instead of ".angular-cli.json" for build and project configuration.

  • Angular 6 will also allow us to use RxJS V6 with the application.

  • Tree Shakable Providers: Angular 6.0 allows to bundle services into the code base in modules where they are injected. This will help to make the application smaller.

For example, in previous Angular versions, the developers used to reference the services as below:


// In app.module.ts
@NgModule({
...
providers: [MyService]
})
export class AppModule {}
// In myservice.ts
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
constructor() { }
}


This approach will still work, but Angular 6.0 provides a new and easier alternative to this. It no longer needs to add references in the NgModule. The develoer can inject the reference directly into the service. Therefore, the developer can use the service as below:


// In myservice.ts
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class MyService {
constructor() { }
}


That is all about the features/improvements in the latest release of Angular. Let us move on and create the first application using Angular 6.0.


Our cost starts from as low as $5K
Why wait when now is the right time to build your app and chase your dream?

Get Started Now