JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<body ng-app="myApp" ng-controller="OrderFormController">
<div id="container">
<select ng-model="selectedName" ng-change="retrieveSelectedClass(selectedName, '{{selectedName}}')" ng-options="(item.name||item) group by item.groupName for item in names"
class="code-helper" id="code-helperId">
<option value="">Select Option</option>
</select>
{{selectedName}}
</div>
</body>
JavaScript
var app = angular.module('myApp', []);
app.controller('OrderFormController', function($scope, $http) {
var foundClass = ["ContactsTodayController_test", "AddPrimaryContact", "AccountProcessorTest", "RandomContactFactory", "LeadProcessorTest", "AccountProcessor", "LeadProcessor", "TestRestrictContactByName", "VerifyDate", "DailyLeadProcessorTest", "TestVerifyDate", "ParkService", "AsyncParkService", "InstallationTests", "MaintenanceRequestHelper", "WarehouseCalloutService", "WarehouseCalloutServiceMock", "WarehouseCalloutServiceTest", "WarehouseSyncSchedule", "AccountManager", "AccountManagerTest"];
$scope.names = foundClass;
$scope.retrieveSelectedClass = function(newValue, oldValue) {
$scope.selectedName = newValue;
}
$(document).ready(function() {
$('.code-helper').select2({
placeholder: 'Select a command to begin'
});
});
});