Angular Select

by bodine30

HTML

<div ng-app="myApp">
    <div ng-controller="MyCtrl">
        <button data-ng-click="addFilter()">Add Filter</button>
        <div data-ng-repeat="c in current.filters">
            <div class="select-box">
                <select data-ng-model="c.filter" data-ng-options="filter.name for filter in filters"></select>
                <input type="text" placeholder="Filter value" data-ng-model="c.value">                
            </div>
        </div>
        <pre>{{current | json}}</pre>
    </div>
</div>

JavaScript

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

app.controller('MyCtrl', function($scope) {
    $scope.current = {"filters":[]};
    $scope.filters = [
        {"id":"1", "name":"Filter A"},
        {"id":"2", "name":"Filter B"},
        {"id":"3", "name":"Filter C"},
        {"id":"4", "name":"Filter D"}
    ];
    
    $scope.addFilter = function() {
        $scope.current.filters.push({ });
    };
});