Module view controls angular-js and filters-2
<!doctype html >
<html ng-app="myapp">
<style>
#mydetails {
display:none;
}
</style>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="angular.min.js"></script>
<script src="content.js"></script>
<style>
li {
list-style:none;
}
</style>
</head>
<body>
<div ng-controller="jit">
all Search : <input type="text" ng-model="searchBox" onKeyUp="details()"><br>
Course Search : <input type="text" ng-model="searchBox.course" > <br>
Duration Search : <input type="text" ng-model="searchBox.duration"><br>
Time Search : <input type="text" ng-model="searchBox.time">
<ul >
<li ng-repeat="jit in details | filter:searchBox">{{jit.course}}{{jit.duration}}{{jit.time}}</li>
</ul>
</div>
</body>
</html>
<html ng-app="myapp">
<style>
#mydetails {
display:none;
}
</style>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="angular.min.js"></script>
<script src="content.js"></script>
<style>
li {
list-style:none;
}
</style>
</head>
<body>
<div ng-controller="jit">
all Search : <input type="text" ng-model="searchBox" onKeyUp="details()"><br>
Course Search : <input type="text" ng-model="searchBox.course" > <br>
Duration Search : <input type="text" ng-model="searchBox.duration"><br>
Time Search : <input type="text" ng-model="searchBox.time">
<ul >
<li ng-repeat="jit in details | filter:searchBox">{{jit.course}}{{jit.duration}}{{jit.time}}</li>
</ul>
</div>
</body>
</html>
content.js
var jeevanit={
"courses":[
{"course":"Graphic Application",
"duration":"2 Months",
"time":"10 am"},
{
"course":"Web Application",
"duration":"3 Months",
"time":"11 am"
},
{
"course":"Web Server Application",
"duration":"4 Months",
"time":"1 pm"
},
{
"course":"Digital Marketing",
"duration":"2 Months",
"time":"8 am"
}
]
}
var app=angular.module('myapp',[]);
app.controller('jit',function($scope){
$scope.details=jeevanit.courses;
});
This blog is useful thank you for sharing Angularjs Online Training Bangalore
ReplyDelete