Slip 17 - D) Write an AngularJS script to search student name according to the character typed and display details( use array and filter).

Solution:

<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js"></script> 

<div ng-app="myApp" ng-controller="myCtrl">

<script>
var app = angular.module('myApp',[]);
app.controller('myCtrl', ['$scope',function($scope) {
$scope.myarr=[
              {fname:'Mihir',lname:'Mandviya',sclass:'SY'},
  {fname:'Tushar',lname:'Soni',sclass:'SY'},
  {fname:'Anurag',lname:'kumar',sclass:'FY'},
  {fname:'Abhishek',lname:'yadav',sclass:'TY'}
  
             ];
   }]);
</script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl">
Enter Name to Search : <input type="text" ng-model="search"><br>
Result :
<ol>
<p><b>Student Name</b> &nbsp &nbsp &nbsp &nbsp <b>Class</b>  </p>
<li ng-repeat="x in myarr | filter: search ">{{ x.fname + "   " + x.lname }}
&nbsp &nbsp &nbsp &nbsp  {{ x.sclass }}
</li>
</ol>
</div>
</body>
</html>


Post a Comment

0 Comments