Is there a sample out there on how to properly use ig.loader with the igniteui angular directives?

I use ig.loader to load up my necessary igniteui components on demand, which means they are not loaded yet when the angular binding starts, which is causing it to crash. 

All of the samples I have been able to find do not use the ig.loader.

Currently I am trying to use the ig-grid directive with data-source="ds":

<ig-grid id="grdItems" data-source="ds" auto-generate-columns="false">

<columns>

<column key="type" header-text="Type" data-type="number">column>

<column key="name" header-text="Name" data-type="string">column>

<column key="value" header-text="Value" data-type="number">column>

<column key="weight" header-text="Weight" data-type="number">column>

columns>

ig-grid>

Where ds is defined in my controller as:

$scope.ds = new $.ig.RemoteDataSource({

type: "remoteUrl",

dataSource: params.getItemsUrl,

responseDataType: "json",

responseDataKey: "items"

});

And my datasource is never getting called

Here is a jsFiddle that is similar to what I am trying to do, except it uses a normal JSONDataSource instead of a RemoteDataSource:

http://jsfiddle.net/apmcmillan/tyeue8zu/