JSFiddle - React, Tailwind, and code Playground

by samibel

HTML

<div ng-app="app">
<div  ng-controller="mainController">
    <ul ng-repeat="movie in movies |filter:Filter.Comedy | filter:Filter.Action  | filter:Filter.Drama">
        <li>{{movie.name}}</li>
    </ul>
    <label>Comedy</label><input  type="checkbox" ng-model="Filter.Comedy" ng-true-value="Comedy"  data-ng-false-value=''/><br/>
     <label>Action</label><input  type="checkbox" ng-model="Filter.Action" ng-true-value="Action"  data-ng-false-value=''/><br/>
     <label>Drama</label><input  type="checkbox" ng-model="Filter.Drama" ng-true-value="Drama"  data-ng-false-value=''/>
     
    
</div>
</div>

JavaScript

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

app.controller('mainController', function($scope) {
    $scope.movies = [{name:'Shrek', genre:'Comedy'},
                     {name:'Die Hard', genre:'Action'},
                     {name:'The Godfather', genre:'Drama'}];
});