Posts

Showing posts with the label Angular Pipes

Angular Observables

In Previous topic we have seen Angular Router and configure it. In this section we will take a look into Angular Observables. Angular Observable ➤➤ Angular Observable is a function that converts ordinary stream of data in Observable stream of data. In Order to use Observable we have to import "Observable" from "rxjs" into component that use it. import { Observable } from 'rxjs'; Observable emits the value from the stream asynchronously. It emits the complete signal when the stream completes or an error signal for any errors. The Observable starts to emit values only when someone subscribes to it. Important Points : Observables are sequence of data that gets emitted asynchronously from time to time or over period time it means that observable will keep producing values. Observable provide support for passing messages between different parts of our application. Angular make use of Observables as an interface to handle a variety of common async operations. Obse...

Angular Pipes

Image
In Previous topic we looked into Angular Directives , in this article we will see Angular Pipes. What is Angular Pipes? Angular Pipes takes the raw data as input and then transform the raw data into desired format. we can also say that angular pipes transform the data into specific format before end user see. Syntax : Expression | pipeOperator[:pipeArguments] The Angular pipes are divided into two part : built-in Pipes and custom Pipes. Built-in pipes are again categorized as parameterized pipes and chaining pipes. Some of the built-in pipes are date pipe, uppercase pipe, lowercase pipe, currency pipe, number pipe etc. Below example will show you unformatted and formatted data using pipes. If you run below code you will see data is not formatted. Now we will use pipes to format these data as show below:  Parameterized Pipes ➤ We can say parameterized pipes are something in which we can pass any number of parameter using colon i.e. " : ". In below code we will see Date and C...