Search This Blog

Monday, October 19, 2015

Creating Simple Search Box using Angular Js


Step1:

Creating Simple Search Box using Angular JS  is nothingin but adding  ng- model in input box

Step 2:

Add this input box  ng-model ="searchBox" and give the name called searchBox

 <input type="text" ng-model ="searchBox">
 
Step 3:

Include the Ng-model name  using pipe ( |)  and filter  options

     <li ng-repeat ="person in persons | filter: searchBox">

 Step 4:

Now if you search in input box with a particular letter result will be display according to it.

<div ng-controller="people">

<input type="text" ng-model ="searchBox">
     <ul>
    
     <li ng-repeat ="person in persons | filter: searchBox">
    
        {{ person.name + ' ' + person.Country }} 
       
        </li>
       
     </ul>

</div>

 Step 5:

That's all Enjoy Folks

No comments:

Post a Comment

Validating to select in sequencial order using angular

    < input type = "checkbox" (change) = "handleSelectTaskItem($event, taskItem)" [checked] = " taskItem . i...