Angular: Empty Fiddle

by Nicolas Panel

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular-resource.min.js"></script>
<div class="row-fluid" >
    <div class="span3" ng-controller="FilterCtrl">
        <form class="form-horizontal">
            <div class="controls-row">
                <label for="searchTextBox" class="control-label">Search:</label>
                <div class="controls">
                    <input type="text"
    id="searchTextBox"
                    ng-model="filterService.searchText"></input>
                </div>
            </div>
            <div class="controls-row">
                <label for="sportComboBox" class="control-label">Sport:</label>
                <div class="controls">
                    <select id="sportComboBox"
    ng-model="filterService.activeFilters.sport">
                        <option ng-repeat="sport in ['Basketball', 'Hockey', 'Football']">
    {{sport}}
                        </option>    
                    </select>
                </div>
            </div>
            <div class="controls-row">
                <label for="cityComboBox" class="control-label">City:</label>
                <div class="controls">
                    <select id="cityComboBox"
    ng-model="filterService.activeFilters.city">
                        <option ng-repeat="city in ['Dallas', 'Los Angeles',
    'Boston', 'New York']">
    {{city}}
                        </option>
                    </select>
                </div>
            </div>
            <div class="controls-row">
                <label class="control-label">Featured:</label>
                <div...

JavaScript

$(document).ready(function() {
    angular.module('myApp', []).
		factory('filterService', function() {
			return {
				 activeFilters: {},
				 searchText: ''
			};
	   }).
		controller('ListCtrl', function($scope, filterService) {
        $scope.filterService = filterService;
        $scope.teamsList = [
            {id: 1, name: 'Dallas Mavericks', sport: 'Basketball', city: 'Dallas', featured: true}, 
            {id: 2, name: 'Dallas Cowboys', sport: 'Football', city: 'Dallas', featured: false}, 
            {id: 3, name: 'New York Knicks', sport: 'Basketball', city: 'New York', featured: false}, 
            {id: 4, name: 'Brooklyn Nets', sport: 'Basketball',city: 'New York', featured: false}, 
            {id: 5, name: 'New York Jets', sport: 'Football', city: 'New York', featured: false}, 
            {id: 6, name: 'New York Giants', sport: 'Football', city: 'New York', featured: true}, 
            {id: 9, name: 'Dallas Stars', sport: 'Hockey', city: 'Dallas', featured: false}, 
            {id: 10, name: 'Boston Bruins', sport: 'Hockey', city: 'Boston', featured: true}
        ];
    }).
	 controller('FilterCtrl', function($scope, filterService) {
        $scope.filterService = filterService;
    });
});