Long List with Filter

by OverZealous

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.5/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="myController">
        <div>Selected Items: {{ getSelected() }}</div>
        <hr/>
        <input ng-model="searchFilter" type="text" />
        <ul>
            <li ng-repeat="value in items | filter: searchFilter">
                <label>
                    <input type="checkbox" ng-model="selectedData[value]" />{{value}}</label>
            </li>
        </ul>
    </div>
</div>

JavaScript

var app = angular.module("myApp", []);

app.controller("myController", ["$scope", function ($scope) {
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz.-_+";
    $scope.items = [];
    for (var i = 0; i < 1100; i++) {
        var item = "";
        for (var c = 0; c < 10; c++) {
            item += possible.charAt(Math.floor(Math.random() * possible.length));
        }
        item = item + " (" + i + ")";
        $scope.items.push(item);
    }

    $scope.selectedData = {};
    $scope.getSelected = function () {
        var list = [];
        for (var val in $scope.selectedData) {
            list.push(val);
        }
        return list.join(", ");
    };
}]);