Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body ng-app="app">
 <div ng-controller="SearchController">
<input type="text" ng-model="searchbar">
    <div ng-show='filterdShows.length > 0'>
        <h3>Shows you've seen:</h3>
        <hr>
        <ul>
            <li ng-repeat="show in filterdShows = (shows | filter: searchbar)">
                {{ show.name }}
                <img alt="{{ show.name }}" src="img/artwork/{{ show.image_name }}.png" style="width:50px;height:50px;">
            </li>
        </ul>
        <hr>
    </div>
    <div ng-show='filteredAllshows.length > 0'>
        <h3>All TV Shows:</h3>
        <hr>
        <ul>
            <li ng-repeat="allshow in filteredAllshows = (allshows| filter: searchbar)">
                {{ allshow.name }}
                <img alt="{{ allshow.name }}" src="img/artwork/{{ allshow.image_name }}.png" style="width:50px;height:50px;">
            </li>
        </ul>
        <hr>
    </div>
</div>
</body>
</html>
 
var app = angular.module('app', []);
app.controller('SearchController', function($scope){
  
  $scope.shows =[{name:"Breaking Bad" ,image_name:""},
                {name:"Prison Break" ,image_name:""},
                {name:"Home Land" ,image_name:""},];
                 
 $scope.allshows =[{name:"Breaking Bad" ,image_name:""},
                {name:"Prison Break" ,image_name:""},
                {name:"Home Land" ,image_name:""},
                {name:"Mad Man" ,image_name:""},
                {name:"Home Land" ,image_name:""},
                
                
                
                ];
 
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
zieemerpro
0viewers