Skip to main content

Posts

Showing posts from 2021

Related Articles

Angular Pipes

This article covers following topics in details: Purpose of having pipes in Angular. Built in Pipes and its usage. How to create custom Pipes Purpose of having pipes in Angular. Pipes are used to format your data based on the requirement. Pipes donate from symbol “|” and you can use it inside the HTML template where you display the data with interpolation. Example if you want to format amount bases on some currency type you can use below expression. {{ amount | currency:'EUR' }} Pipes is simply a function which accept an input values such as integers, strings, arrays, and date and returns the transform value and display the same in the browser. Built in Pipes and its usage. There are several built in pipes in Angular. Uppercase pipe Lowercase pipe Date pipe Currency pipe Percent pipe Decimal pipe Slice pipe After setting up the environment and creating the example app we will try out each default pipe provided by Angular framework. Angular Related Articles: 1.  How to set up An...

How to use Angular HttpClient and RxJS to consume REST API

Today I am going to discuss how you can interact with REST API services to load and manage data.  Prerequisites Before getting started, you need to have the below software installed on your development machine: • Node.js and npm. You can install both of them from the Node.js • Angular CLI  (You can install it from npm using: npm install -g @angular/cli) Frontend applications needs to call backend services over http/https protocol to manage dynamic data. Best place to access data from backend APIs are service component. Once you defined your service class you can inject it in to component or another service to use the service methods.  Angular Related Articles: 1.  How to set up Angular environment 2.  How to create Angular project 3.  How to generate component and define routings in Angular 4.  Adding styles to your Angular App 5.  Angular NgFor directive and trackby 6.  Getting Started With PrimeNG Styling in Angular App 7.  PrimeNG...