How to delete / destroy record in rails API backend from an ember.js frontend

I have a rails API backend that contains various records, and I would like to be able to delete them from the ember.js frontend. I am able to display the records using ember.js but when I click the delete button that I added via ember the record is not being deleted within the rails backend. I am not even seeing any activity from the rails server in the console when I click the delete button.

ember

// app/routes/index.js

import Ember from 'ember';

export default Ember.Route.extend({
    model: function() {
        return this.store.find('csv-file');
    },
    actions: {
        delete(csvFile) {
            // debugger;
            csvFile.destroyRecord();

            // csvFile.save();
        }
    }
});

// app/models/csv-file.js

import DS from 'ember-data';

export default DS.Model.extend({
    csv_file_filename: DS.attr('string')
    // id: DS.attr('int');
});

// app/templates/csv-files/index.hbs

<h3>Hi CSV Files</h3>
<ul>
    {{#each model as |csv|}}
        <li>
            {{csv.id}} - {{csv.csv_file_filename}}
            <button {{action 'delete' csvFile}}>Delete</button>
        </li>
    {{/each}}
</ul>

rails

# csv_files_controller.rb

# DELETE /csv_files/1
  # DELETE /csv_files/1.json
  def destroy
    @csv_file = CsvFile.find(params[:id])
    if @csv_file.destroy
      render :json => { :head => ok }, status: 200
    else
      render json: {error: "csv file could not be deleted."}, status: 422
    end
  end