JSFiddle - React, Tailwind, and code Playground

by DotDotDot

HTML

<div ng-app='tt'>
    <div ng-controller='ctrl'>
        <input type='text' ng-model='searchWord' /><input type='button' ng-click='searchIt()' value='Search' />
    <div ng-repeat='(key,val) in uniqueLists'>
       <form name='{{key}}'>
           {{key}}
            <p ng-repeat='value in val'>
                <input type='checkbox' ng-model='selectedData[key][value]' />{{value}}
            </p>
        </form>
        
    </div>
        {{uniqueLists}}<br/>
        {{selectedData}}
    </div>    
</div>

CSS

</style>
<script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js'></script>
<style>

JavaScript

var tt=angular.module('tt',[]);
tt.controller('ctrl',function($scope){
    $scope.selectedData={};
    $scope.logMe=function(){
     console.log($scope);   
    }
    $scope.uniqueLists = {
        name: [
                'string1',
                'string2',
                'string3'
                // Lots of strings
        ],
        Category: [
                'string4',
                'string5',
                'string6'
                // Lots of strings
        ],
        designer: [
                'string7',
                'string8',
                'string9'
                // Lots of strings
        ]
    };
    console.log($scope.uniqueLists);
    for (var i in $scope.uniqueLists)
    {
     console.log(i,$scope.uniqueLists[i] )  
     $scope.selectedData[i]={}
         for(var j in $scope.uniqueLists[i])
         {
             console.log($scope.uniqueLists[i][j])
             $scope.selectedData[i][$scope.uniqueLists[i][j]]=false;
         }
    }
    console.log($scope.selectedData);
    
    $scope.searchIt=function()
    {
         if($scope.searchWord.length >1 )
         {
              var splitted=$scope.searchWord.split(' ');
             for( var i in splitted)
             {
                  for( var k in $scope.selectedData)
                  {
                       console.log(k,$scope.selectedData[k]);
                       if(typeof($scope.selectedData[k][splitted[i]])!='undefined')
                       {
                        console.log("found ", splitted[i]);
                        $scope.selectedData[k][splitted[i]]=true;
                       }
                  }
             }
         }
    }
});