JSFiddle - React, Tailwind, and code Playground

by LostInDaJungle

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<div ng-controller="app">
    <div ng-repeat="p in filteredPresentations">{{p.name}}</div>
    <button ng-click="filterShit()">Filter that shit</button>
</div>

JavaScript

var app = angular.module('app', []);
app.controller('app', function() {
    $scope.filterTags = [{name: purple}];
    $scope.presentation = [
        {name: "Pres1", tags: ['purple', 'test']},
        {name: "Pres2", tags: ['test']},
        {name: "Pres3", tags: []},
        {name: "Pres4", tags: ['purple']},
        {name: "Pres5", tags: ['purple']}
        ];
    $scope.filteredPresentations = $scope.presentation;
    
    $scope.filterShit = function() {
        console.log("Filtering shit.");
   		angular.forEach($scope.filterTags, function (o, idx){
			var tag = o.name;
			console.log("Filtered presentations: "+$scope.filteredPresentations.length);
			angular.forEach($scope.filteredPresentations, function(p, i) {
				console.log("Tag "+idx+": ", tag);
				console.log(p.name+" Presentation tags index "+i, p.tags);
				if (p.tags.indexOf(tag) == -1) {
					console.log("No match - removing.")
					$scope.filteredPresentations.splice(i, 1);
				} else {
					console.log("WE have a match - Keeping.");
				}
			});
		});
    }

});