JSFiddle - React, Tailwind, and code Playground

HTML

<form class="custom">
        <select id="customDropdown" class="small button dropdown secondary radius" ng-model="filterSolution"
                ng-change="selectMovieFilter()">
            <option DISABLED value="">
                <script type="text/javascript">document.write(solutions_dropdown_text)</script>
            </option>
            <option ng-repeat="solution in SolutionResultList.objects" ng-click="addFilterSolution(solution)" value="{{solution.id}}">
                {{solution.SolutionName}}
            </option>
        </select>
	<label>
            Number:
			<input type="textfield" name="total" id="total" disabled />

    </label>
    </form>

JavaScript

var MovieModule = angular.module('MovieModule', ['ngResource']).constant('MOVIES', 'MovieModule')
    .directive('myRepeatDirective', function () {
        return function (scope, element, attrs) {
            if (scope.$last) {
                console.log(scope.$index+1);
				var total = scope.$index+1
				document.getElementById('total').value = total;
            }
        };
    });


$scope.addFilterSolution = function (solution) {
        $scope.filterMovieBySolution = solution.SolutionName;
        console.log($scope.filterMovieBySolution);
    }

    $scope.solutionFilter = function (disk) {
		var filteredItems = [];
        for (var key in $scope.DiskResultList['objects']) {
            if ($scope.DiskResultList['objects'][key].id == disk.id) {
                $scope.solution = $scope.DiskResultList['objects'][key].IdSolution;
            }
        }
		
        if ($scope.filterMovieBySolution == "")
            return true;

        if ($scope.solution[0].SolutionName == $scope.filterMovieBySolution)
            return true;
        else
            return false;
    }