Give this a try:
let myApp = angular.module('myApp', []);
myApp.controller('studentController', function($scope, $http) {
let url = "Student.json";
$http.get(url).then(function(response) {
$scope.students = response.data;
});
$scope.removeElement = function(array, index) {
array.splice(index, 1);
};
});
<div ng-controller="studentController">
<h1>Student Information </h1>
<table>
<tr>
<th>Name</th>
<th>Roll No</th>
<th>Percentage</th>
</tr>
<tr ng-repeat="student in students">
<td>
<input type="text" ng-model="student.Name" ng-show="student.edit">
<span ng-hide="student.edit">{{ student.Name }}</span>
</td>
<td>
<input type="text" ng-model="student.RollNo" ng-show="student.edit">
<span ng-hide="student.edit">{{ student.RollNo }}</span>
</td>
<td>
<input type="text" ng-model="student.Percentage" ng-show="student.edit">
<span ng-hide="student.edit">{{ student.Percentage }}</span>
</td>
<td>
<button id="button2" ng-hide="student.edit" ng-click="student.edit = true">Edit</button>
<button id="button4" ng-hide="student.edit" ng-click="removeElement(students, $index)">Delete({{$index}})</button>
<button id="button3" ng-show="student.edit" ng-click="student.edit = false">Submit</button>
</td>
</tr>
</table>
</div>