Angular 2

How to start with Angular 2

Angular 1 is basically developed for google developers for their internal use and more over it is developed for UI designing purpose and later they extended many features like two way data binding etc. Now Angular js 1 is widly used by developers, and some architectures and developers points about performance issues and angular core team finally come up with a new version Angular 2.Which is well structured and it offers a very good performance....

Continue Reading

ng-repeat in angular 2

Looping is very simple in Angular js 1, don't worry it is more simple in Angular js 2 as well with lot of performance improvement. Let us check .....

Continue Reading

Angular 2 filter using pipe concept

Yes we can do the filtering in Angular 2 as well, instead of filter it is pipe concept. Pipe will take the data and convert into desired output. There are many built in pipes like date, uppercase etc. Let us check here how we can create a custom pipes .....

Continue Reading

ng-click in angular 2

ng-click in angular js 2 is different from angular js 1. Let us check how it is in angular js 1 first......

Continue Reading

ng-if in angular 2

Angular js 1 ng-if is pretty straight forward to use. Let us check how it is in angular js 2....

Continue Reading

Show and hide in Angular 2

Let us check how it is in Angular js 2....

Continue Reading

Get selected values on click and show in the UI - Angular 2

There is lot of difference between angular one and two. Angular two is supporting JavaScript ES6 which is not yet supported by latest browsers however you can use current JavaScript ES5 with angular 2. But you may not be able to enjoy all features of angular 2 in this case. Let us check how we can show selected value on click in angular 2.....

Continue Reading

How to build toggle button or collapsible panel using angular 2

Let us check how we can build a toggle button using angular js 2. Same code you can use for building collapsible panel as well. It is almost similar like angular js 1 concept except some syntax changes. So if you are an angular js 1 guy, you are the best person to learn angular js2 as well :) :).....

Continue Reading

Simple search using pipe in angular 2

In this article I will be explaining about how to implement a simple search using pipe concept. I have explained in my previous articles how to do a simple search or filtering using angular 1. If you want to compare both implementation you can refer below reference url as well...

Continue Reading

Date filtering and formatting using pipe in Angular 2

Here I am going to discuss about date filtering/formatting using pipe. There are many inbuilt pipe in Angular 2 for date filtering. Let us check some of them first...

Continue Reading

Select all/ deselect all checkbox - Angular 2

Here I am going to discuss about implementing a select all/deselect all checkbox using Angular 2. I have explained the same using Angular js 1 and Jquery. If you want to compare the implementation please check below post as well...

Continue Reading

Collapsible menu using Angular 2 | Nested menu using Angular 2

Here I am going to explain about how to implement a simple collapsible or nested menu using Angular 2. Let us create simple component first...

Continue Reading

Add class to an active element - angular 2

Here I am going to discuss about adding a class to an active element. For example if we click on a link or dynamic menu we need to highlight that with a color. In this article we will be discussing the same in different scenarios....

Continue Reading

Angular simple progress bar using bootstrap.

Here I am going to explain how to build a progress bar using angular 1 and 2. I will be explaining this by using bootstrap 2 and 3 as well...

Continue Reading

Angular 2 simple client side pagination

Let us check how we can build a simple client side pagination using Angular 2. Basically it is so straight forwarded and we can achieve this by using very less code...

Continue Reading

Angular: Create reusable component and pass data to component

Here we will be discussing about reusing a component and also about how to pass data to a component...

Continue Reading

Angular: Share data between components using service file

We can easily communicate with components by making a service file common. Inject the service file where ever you want and use it and this is the most preferred way.....

Continue Reading

How to communicate between a component and a service file

In this article we will be discussing about how to communicate between a component and a service file...

Continue Reading

Angular show more/less pagination

In this article we will be discussing about developing a show more/less pagination using angular. Basically it is so simple which can be achieved by very less code....

Continue Reading

Angular window scroll up using a component

Let us check how we can scroll up the page/window using angular. I will be creating a simple component that can be placed anywhere in the page and user can click on the button to scroll up the page...

Continue Reading

Disable submit button until all mandatory fields are filled - Angular

Let us check how we can disable submit button of a form until all mandatory fields are filled. Angular folks made these things very simple, before explaining those you can check...

Continue Reading

How to show a date is today or yesterday or last week etc using pipe - Angular

Let us check how we can convert a timestamp/date to today or last week etc using a simple angular pipe. This will be very help full for users to understand the time very clearly. We can achieve this by using a simple pipe....

Continue Reading

Rating star component using Angular.

In this article I will be discussing about implementing a simple rating star component. This component can be reused very easily. Let us check with a working example....

Continue Reading

Communicate with parent and child component in Angular.

In this article we will be discussing about communicating between child and parent component in Angular. $scope and $rootScope concepts are removed in Angular, and this is one of the reason for improved performance in Angular application....

Continue Reading

Format date using pipe and append local time zone - Angular

Since most of the countries has different time zone and date time, it is important to show local time zone for users. Let us check how we can format a date and append a local time zone along with that. I will be creating a simple pipe and append the local time zone along with that. I will be adding local time zone logic into a service file, advantage is that you can easily inject and use it anywhere...

Continue Reading

Multi checkbox dropdown component using Angular

Here I am going to explain about creating a simple multi select checkbox dropdown component using angular. This component can reuse by adding anywhere in the application. Let check with working example....

Continue Reading

Angular simple sort

Here I will be discussing about doing a simple sort using Angular and JavaScript...

Continue Reading