Posts

Showing posts from May, 2020

How to disable table row in Angular

How to disable table row in Angular ? , ANGULAR WITH CORE .NET AND MVC RAZOR ENGINE   How to disable table row in Angular In this article we will learn how to disable every alternate (even) row in Table by using CSS. Step 1: Let's create an HTML table using below code                                     <table class="main-table">                   <thead>                      <tr>                         <th>                             Sr No.                          </th>                         <th>                              Fruit Name                          </th>                      </tr>                   </thead>                   <tbody>                      <tr *ngFor="let fruit of duplicateArray; let i = index; let even = even">                         

Get unique values from Array in Angular

Get unique values from Array in Angular , ANGULAR WITH CORE .NET AND MVC RAZOR ENGINE   In this article, we will learn how to remove duplicate items from Array in Angular Playing with the array is very common in any programming language. Very often we faced a situation where we need to remove duplicate items from Array. so here we will learn 3 different ways to remove duplicate items from Array Step 1 : By using Set   GetUniqueItemsBySets() { this.uniqueItemsbySets = [...new Set(this.duplicateArray)]; }     Step 2 : By foreach   GetUniqueItemsByForeach() { this.duplicateArray.forEach(items =&gt; { if (!this.uniqueItemsbyForeach.includes(items)) { this.uniqueItemsbyForeach.push(items); } }); }     Step 2 : By filter   GetUniqueItemsByfilter() { this.duplicateArray.filter(items =&gt; { if (this.uniqueItemsbyfilter.indexOf(items) === (-1)) { this.uniqueItemsbyfilter.push(items); } }); }

How to use @input in Angular

Image
How to use @input in Angular ? , ANGULAR WITH CORE .NET AND MVC RAZOR ENGINE   @Input  Decorator that marks a class field as an input property and supplies configuration metadata. The input property is bound to a DOM property in the template. During change detection, Angular automatically updates the data property with the DOM property's value. Let's take an example to understand it better 😊 We need to pass data from parent component to child component using @input  Step 1: Create a parent component by using the below code :  parent.component.html                    < h2 >This is parent component</ h2 >               < label   for = "cars" >Choose a Type:                             </ label >                           <!-- onChange($event) -->               <