[AngularJS] Angularjs - How do I output my custom filters to the dom correctly?

[Cortney Robinson]

Sorry noob question:

How can I best collect the current 'active' filter parameters (like type, 
price, etc etc) and for each one that angular is filtering by add them to 
my dom as a li/button/ahref along with the ability to click on the new dom 
element and remove it as a filter and from the dom.

I have built it out in the link below but when I add a filter it gets added 
to the dom multiple times. Can't seem to figure it out.

*Functional Link*

http://jsfiddle.net/im_cr/2t5hfumf/4/

*Code:*

Enter code here(function(){

//$('.filterList').append('<li>cortney</li>');
var app = angular.module('filter',[]);

app.controller('FilterCtrl',function myFilter($scope){
      $scope.orderByField = 'type';
      $scope.reverseSort = false;
      $scope.filters = [];
      $scope.minprice = 0;
      $scope.filterCars = function(item){
          var index = $scope.filters.indexOf(item);
          
          if(index == -1) {
              $scope.filters.push(item);
          } else {
              $scope.filters.splice(index, 1);
          }
          
          //console.log($scope.filters);
      };      
      $scope.filter = function(value) {
        return $scope.filters.length == 0 || 
($scope.filters.indexOf(value._type) != -1) && (value._price > 
$scope.minprice);
      };
      $scope.getTotalFilters = function(){
          //console.log($scope.filters);
          return $scope.filters;
      };
      $scope.showTotalFilters = function(){
          var myfilters = $scope.getTotalFilters();
         
          $.each(myfilters,function(index,value){
             $('.filterList').append('<li>' + value + '</li>');
          });
          return myfilters
          
      };
      
      $scope.data = {
          models: [
              {
               "_name" : "sedan",
               "_ext" : "S Sedan",
               "_type" : "sedan",
               "_body_style": "sedan",
               "_price": "13865",
               "_mpg_city": "28",
               "_mpg_hwy": "36",
               "_fuel_eff": "31",
               "_year": "2014",
               "_seating": 5
             },{
               "_name" : "hatch",
               "_ext" : "S Hatch",
               "_type" : "hatch",
               "_body_style": "hatch",
               "_price": "14365",
               "_mpg_city": "28",
               "_mpg_hwy": "36",
               "_fuel_eff": "31",
               "_year": "2014",
               "_seating": 5
             },{
               "_name" : "suv",
               "_ext" : "SE Sedan",
               "_type" : "suv",
               "_body_style": "suv",
               "_price": "15095",
               "_mpg_city": "28",
               "_mpg_hwy": "36",
               "_fuel_eff": "31",
               "_year": "2014",
               "_seating": 5
             }]
      };
    $scope.models = $scope.data.models;
    
      
});
 
})();...



-- 
You received this message because you are subscribed to the Google Groups 
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.