JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app>
    <div ng-controller="Ctrl" id="midi-ctrl">
        <table>
            <tr ng-repeat="plugin in plugins">
                <td><strong>{{plugin.name}}</strong>

                </td>
                <td>
                    <select class="span1" ng-model="plugin.selectedChannel" ng-options="item.ID as item.Title for item in channels">
                </td>
                <td>
                    <select class="span2" ng-model="plugin.selectedDevice" ng-options="item.ID as item.Title for item in devices">
                </td>
                <td>{{plugin}}</td>
            </tr>
        </table>
    </div>
</div>

JavaScript

function Ctrl($scope) {
    $scope.plugins = [{
        name: 'A'
    }, {
        name: 'B'
    }];
    $scope.channels = [{
        ID: 'all',
        Title: 'All'
    }, {
        ID: '0',
        Title: '1'
    }, {
        ID: '1',
        Title: '2'
    }, {
        ID: '2',
        Title: '3'
    }];

    $scope.devices = [{
        ID: '0',
        Title: 'Device A'
    }, {
        ID: '1',
        Title: 'Device B'
    }, {
        ID: '2',
        Title: 'Device C'
    }, {
        ID: '3',
        Title: 'Device D'
    }, ];
}