Articles → ANGULAR.JS → Image Search Using Angular.JS

Image Search Using Angular.JS






Get The List Of Images




Picture showing the folder with the list of images

Click to Enlarge


Create A Controller




<script type="text/javascript">
var app = angular.module('app', []);
app.controller('myController', function($scope) {
	$scope.Images = ["Chrysanthemum", "Desert", "Hydrangeas", "Jellyfish", "Koala", "Lighthouse", "Penguins", "Tulips"];
});        
</script>



Create Search Controls




<div ng-app="app" ng-controller="myController"><input type="text" ng-model="ImageFilter" /><img ng-repeat="img in Images | filter: ImageFilter" width="50" height="50" src="Images\{{img}}.jpg" alt="{{img}}" /><br /></div>



Output




Picture showing the output of Image search using angular.js

Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Sunday, January 24, 2016

Query/Feedback


Your Email Id  
 
Subject 
 
Query/FeedbackCharacters remaining 250