Sinatra & Angular $HTTP.delete 404 - html

Question

Trying to delete from my API which is hosted on Heroku.
In Ruby file CROSS-ORIGIN is enable and I can get information from my API.
Although I have a problem when I want to make a delete request to the server.
I get an error 404 (Page not found), but when typing the url into the browser myself I can easily get this page.
cURL call works fine without any problems too.
script.js
$scope.DeleteData = function (index) {
$scope.id = $scope.companies[index].companyID;
var deleteUrl = 'https://*****.herokuapp.com/api/v1/companies/' + $scope.id;
$http.delete(deleteUrl,'DELETE').then(function(response){
console.log(response);
},function(errorResponse){
console.log(errorResponse);
});
};
Ruby.rb
delete '/companies/:companyID' do
tempCompanyID = params['companyID']
company = Company.where(companyID: tempCompanyID).first
company.destroy
end
Html:
<div ng-app="myApp" ng-controller="companyCtrl">
<table class="table table-striped table-hover">
<thead class="thead-dark">
<th>Company ID</th>
<th>Company Name</th>
<th>Address</th>
<th>City</th>
<th>Country</th>
<th>Owners</th>
<th></th>
</thead>
<tr ng-repeat="company in companies">
<td>{{company.companyID}}</td>
<td>{{company.companyName}}</td>
<td>{{company.address}}</td>
<td>{{company.city}}</td>
<td>{{company.country}}</td>
<td>{{company.owners}}</td>
<td><button class="btn" name="_method" ng-click="DeleteData($index)">Delete</button></td>
</tr>
</table>
</div>
Chrome response:
The response