JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
<div ng-controller="editor">
    <label>Length</label>
    <select ng-model="length">
        <option ng-repeat="size in sizes" ng-click="setLength(size)">{{size}}</option>
    </select>
    <label>Width</label>
    <select ng-model="width">
        <option ng-repeat="size in sizes" ng-click="setWidth(size)">{{size}}</option>
    </select>
    <table>
        <tbody>
            <tr ng-repeat='row in cells track by $index'>
                <td ng-repeat='cell in row track by $index'>
                    {{cell}}
                </td>
            </tr>
        </tbody>
    </table>
</div>

JavaScript

var myapp = angular.module('myApp', []);

myapp.controller('editor',function ($scope) {
        
    $scope.cells = [];
    $scope.sizes = [];

    makeSizes();

    $scope.length = $scope.sizes[0];
    $scope.width = $scope.sizes[0];

    function makeMap(){
        $scope.cells=new Array($scope.width);
        var row =new Array($scope.length);
        for(var j=0;j<row.length;j++){
            row.push('cell');
        }
        for(var i=0;i<$scope.cells.length;i++){
            $scope.cells.push(row);
        }
    }

    makeMap();

    function makeSizes(){
        $scope.sizes=new Array(5);
        for(var i=0;i<$scope.sizes.length;i++){
            $scope.sizes[i]=i+3;
        }
    }


    $scope.setLength = function (item) {
        $scope.length = item;
        makeMap();
        //$route.reload();
        $scope.cells.apply();
    }

    $scope.setWidth = function (item) {
        $scope.width = item;
        makeMap();
        //$route.reload();
        $scope.cells.apply();
    }
    

});