Anil Singh | Code-sample.com

What is Pipes? “Pipes transform displayed values within a template.” Sometimes, the data is not displays in the well format on the template that time where using pipes. You also can execute a function in the template to get its returned value. The Pipe class implements the “ PipeTransform ” interfaces transform method that accepts an input value and returns the transformed result. The “ @Pipe ” decorator allows us to define the pipe name that is globally available for use in any template in the across application. The Angular core “@angular/core” provides two types of filtering features i.e. ü   Piple and ü   PipeTransform To implement filtering features we must import Pipe, PipeTransform modules- import { Pipe , PipeTransform } from '@angular/core' ;  Now I am create a steps by steps example to understand filers. Steps 1 – Firstly I will create the Pipe filter in our app folder. Customer Properties class looks like - export cl...

In this post, I am going to share the demo example for “ Filter Array Object ” Example using “ TextBox ” in Angular 1.5. In the below example, I have a “ Products Object ” and render on the “ Table Grid ” and after that filter product grid using the Search textbox . Stayed Informed – Live demo Example [fiddles and plunker] The Example as, JavaScript Code, <script> angular.element( document ).ready( function () { var app = angular.module( 'myApp' , []); app.controller( 'myCtrl' , [ '$scope' , 'store' , function ($scope, store) { $scope.search = '' ; $scope.products = []; $scope.products = store.getProducts(); $scope.filterProductsByCategory = function (category) { $scope.search = category; }; }]); // fake service, substitute with your server call ($http) app.factory( 'store' , function () { var products = [{ ...