Skip to main content

Posts

Showing posts with the label Angular 5

List Of Commonly Used Angular Commands

1) To get the npm version,    npm -v 2) To get the node version,    node -v 3) To get the Angular version,    ng v  4) To get the Jasmine version,    jasmine -v  5) To get the Karma version,    karma --version  6) To install Angular CLI,    npm install @angular/cli -g   npm install @angular/cli 7) To install the next version of Angular CLI, v   npm install @angular/cli@next  8) To get help in the terminal,    ng help 9) To create a new project in Angular,    ng new project-name  10) To skip external dependencies while creating a new project,    ng new project-name --skip-install  11) To run the Angular project,   ng serve (or) npm start (or) ng serve --force  12...

How To Use .map() In Angular

In this blog, I will explain how to use .map() functions in Angular. We have an array containing multiple objects, each one representing an employee. You need to retrieve the id of each employee in an array object. Input :- var employees = [   { id: 11, name: 'Ravishankar' },   { id: 12, name: 'Muthu' },  { id: 13, name: 'Mani' },   { id: 14, name: 'Ajith' }  ]; Output :- [11, 12, 13, 14]  var employeeIds = employees.map(employee => employee.id);   The callback runs for each value in an array and returns new value in the resulting array. The resulting array length will be the same as the original array.

How To Use .filter() In Angular

In this blog, I will explain how to use .filter() function in Angular. We have an array containing multiple objects, each one representing an employee, but only want some of the objects in it. That’s where .filter() comes in. var employees = [ { "id": 1, "name": "Nikhil", "role": "Developer" }, { "id": 2, "name": "Nikunj", "role": "Tester" }, { "id": 3, "name": "Dharmesh", "role": "Tester" }, { "id": 4, "name": "Mikin", "role": "Developer" } ] So we want two arrays, one for employee a role is a Developer and another one is for Tester. You can achieve this using .filter(). var developers = employees.filter(employee => employee.role == "Developer"); var Testers = ...

How To Set Focus On Text Box In Angular 5.

Here, I will explain how to set focus on text box using ElementRef. Demo.html :  <input type="text" class="form-control" value="" #barcode placeholder="Barcode" [(ngModel)]="Barcode" (blur)="SetFocus()" /> Demo.Component.ts : import { Component, OnInit, ElementRef } from '@angular/core'; export class StockDataTableComponent implements OnInit, OnChanges {     @ViewChild('Barcode') barcode: ElementRef;      constructor(){}     function SetFocus(){            this.barcode = "";            this.barcode.nativeElement.focus();     } }

New features, performance improvements, and bug fixes In Angular 5.

Angular 5 is going to be a much better Angular. The Angular version 5 will be fully released in September/October 2017 . Angular 5 contains a bunch of new features, performance improvements, and a lot of bug fixes. Make AOT the default Watch mode Type checking in templates More flexible metadata Remove *.ngfactory.ts files Better error messages Smooth upgrades Tree-Shakeable components Hybrid Upgrade Application Angular 5 - Performance Improvements Use of addEventListener for the faster rendering and it is the core functionality. Update to new version of build-optimizer. Added some Improvements on the abstract class methods and interfaces Remove decorator DSL which depends on Reflect for Improve the Performance of Apps and This is the core functionality. Added an option to remove blank text nodes from compiled templates  Switch Angular to use Static-Injector instead of Reflective-Injector. Improve the applications testing. Improve the performance of hybri...