mskel
mskel

Reputation: 872

Integrating library with asynchronous loading in AngularJS app

I want to use the library MIDI.js in my AngularJS app. To initialise it, you call MIDI.loadPlugin which takes a callback that fires when some files are loaded.

I want to make a controller in my app aware of when the files are loaded.

My current approach is a dedicated service which calls MIDI.loadPlugin when it is created, and sends a $rootScope.$broadcast when the callback is fired.

Is this the best approach, particularly in regards to testability?

Upvotes: 0

Views: 152

Answers (2)

mskel
mskel

Reputation: 872

Here's the solution I came up with based on Gordon's suggestion.

.factory('midiLoader', ['MIDI', '$q', function (MIDI, $q) {

  var service = {};

  service.loadFiles = function() {
    return $q(function(resolve, reject) {
      MIDI.loadPlugin({
        soundfontUrl: "bower_components/midi/soundfont/",
        instrument: "acoustic_grand_piano",
        callback: function () {
          resolve(null);
        }
      });
    });
  }

  return service;

});

Upvotes: 0

Gordon Bockus
Gordon Bockus

Reputation: 868

I would use a promise in your service to get access to the async resource. Then for all functions in the service that need it they just call the get method that returns a promise.

I'll try to post some example code later when on the computer.

Upvotes: 1

Related Questions