JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<div ng-app="docsSimpleDirective"> 
<div ng-controller="Controller">
  <!--<div my-customer ng-repeat=" c in customer"></div>-->
          <div ng-repeat="d in data">
            Search: <input ng-model="query" type="text" />
        
            <select ng-model="obj.category1" ng-options="item1 for  item1 in abms" >
                <option  value="" >Home</option>
            </select>
			
			<div class="myCust" >
				<div class="myTag" id="close{{$index}}" ng-repeat="c in multipleVlaue" > 
					<span id="close{{$index}}"> {{c}} </span>
					<a href="" class="close{{$index}}" id="close{{$index}}" ng-click="remove(item)" >x</a> 
				</div> 
			</div>
			<div  ng-repeat="item1 in filterItems(d) | filter:query | findobj:obj.category1 ">
			<div class="myData">
				 <p>PageTypeIndicator : {{item1.PageTypeIndicator}}</p>
				 <p>Goto  :<a ng-href="{{item1.Link}}">{{item1.MainHeading}}</a></p> 
                 <p> PublishDate  : {{item1.PublishDate }}</p>
                 <p> PageViewCount  : {{item1.PageViewCount}}</p>
               
			           <!-- <a href="" id="close" onclick="myFunction()">x</a>
			   
               <p>PageID:  {{item1.PageID}}</p>
                <p>PageTypeName  : {{item1.PageTypeName}}</p>
               <p> PageViewCount : {{item1.PageViewCount}}</p>
               <p> Preamble  : <span ng-bind-html="$sce.trustAsHtml(item1.Preamble._unparsedString)"></span></p>
               <p> PublishDate  : {{item1.PublishDate }}</p>-->
				
			</div >
			
			</div>
          </div>
</div>
    </div>

CSS

.myData{
		border: 1px solid rgb(190, 108, 108);
        padding: 15px;
		 border-radius: 10px;
		 width : 700px;
		
	}
	
	.myTag{
		border-style: solid;
		border-color: #287EC7;
		border-radius:7px;
		display: inline;
		padding : 2px;
		background: rgb(232, 161, 174);
}.myCust{
padding : 10px;
	border-style: solid; width : 700px;
}

JavaScript

(function(angular) {
  'use strict';
angular.module('docsSimpleDirective', [])
.filter('findobj', function () {
    return function (dataobj, selected) {
        if (!selected) return dataobj;
        return dataobj.filter(function (news) {
            
            return news.CategoryList.some(function (category) {
                return category.DisplayName === selected;
            });
        });
    };
})
  .controller('Controller', ['$scope','$http','$filter','$sce', function($scope, $http, $filter, $sce){
	$scope.$sce = $sce;
	
	 var news = [{
        "NewsList": [{
            "CategoryList": [{
                "CategoryName": "PressStatements",
                    "DisplayName": "Press Statements",
                    "ID": 9
            }, {
                "CategoryName": "Reports",
                    "DisplayName": "Reports",
                    "ID": 10
            }],
                "Link": "\/news-container\/news-page-2\/",
                "MainHeading": "News 2",
                "PageID": 23,
                "PageTypeIndicator": "NewsArticle",
                "PageTypeName": "News Page 2",
                "PageViewCount": "20",
                "Preamble": null,
                "PublishDate": "\/Date(1435842382000+0000)\/"
        }, {
            "CategoryList": [{
                "CategoryName": "InvestorRelations",
                    "DisplayName": "Investor Relations",
                    "ID": 6
            }],
                "Link": "\/news-container\/news-article\/",
                "MainHeading": "Heading",
                "PageID": 20,
                "PageTypeIndicator": "NewsArticle",
                "PageTypeName": "News Article",
                "PageViewCount": "20",
                "Preamble": {
                "_unparsedString": "<p>Intro&nbsp;<\/p>"
            },
                "PublishDate": "\/Date(1435837792000+0000)\/"
        }, {
            "CategoryList": [{
                "CategoryName": "Career",
                  ...