JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="appTable">
    <div ng-controller="appController">
        <input type="text" ng-model="user.name"/><br/>
        <input type="text" ng-model="user.dept"/><br/>
        <button ng-click="add()"> Add </button> 
         
        <table>
            <th>
                <td>S.No</td>
                <td>Name</td>
                <td>Dept</td>
                <td>Delete</td>
            </th>
            <tr ng-repeat="employee in employeeList">
                <td>{{$index}}</td>    
                <td>{{employee.name}}</td>    
                <td>{{employee.dept}}</td>
                <td><input type="button" value="D" ng-click="remove($index)" /></td>
            </tr>
        </table>
    </div>    
</div>

JavaScript

var app = angular.module("appTable",[]);
app.controller("appController",function($scope) {
    $scope.user = {};
    $scope.user.name = "";
    $scope.user.dept = "";
    $scope.employeeList = [];
    $scope.add = function(){
        var data = {};
       data.name = $scope.user.name ;
       data.dept = $scope.user.dept;
       $scope.employeeList.push(data);
        console.log($scope.employeeList);
    }
    
    $scope.remove = function(obj){
       // console.log('data from remove'+obj);
        //console.log('before'+$scope.employeeList);
       // $scope.employeeList.splice(obj, obj);
        console.log('end'+$scope.employeeList);
        
        if(obj != -1) {
	    $scope.employeeList.splice(obj, 1);
}
    }
});