How to access a JSON file in my controller

In my Ember app, I have a JSON file filled with data in my public directory (I.E. public/data/articles.json.

I have an article route where I would like to load in this data and display it in the front-end. How could I do this successfully? I am willing to use the model hook, however I don't know of a solution off-hand.

I currently have the following code in my controller. However, this doesn't work (most likely because the data is loaded in after it is rendered).

import Controller from '@ember/controller';
import $ from 'jquery';

export default Controller.extend({
  init() {
    this._super(...arguments);
    $.getJSON("/data/articles.json", function (data) {
      console.log("test");
      console.log(data);
      this.articleData = data;
  }
})