Having trouble with angular resource and ionic menuContent

I am trying to use $resource and have set up a factory to retrieve a rails4/grape based api. I am able to retrieve the object (labs) in the console. However, I get nothing to display.

I was following the tutorials at learn ionic and in this blog. I am listing the app.js, controllers.js and the services.js files in this gist.

I have been working on this for days without any success. I would be very happy if someone showed the way out.

The code concerning retrieving the labs and a single item(lab) is what I want. The rest of code is additional and not relevant to the problem. I have zero experience with angular so pardon me if I stated that was obviously misplaced or wrong.

Thanks in advance.

Seems to be a problem with resolve of the ui-router.

Here’s the code presently:

resolve: {
  LabsResource: "LabsResource",
  labsData: function(LabsResource) {
    return LabsResource.get().$promise;
  }
}

The array is returned in my console with labsData.labs, but my view is a blank page without the menu.

Can someone help with this one?

Hey @orthodoc - is LabsService defined anywhere? Not sure if it is relevant, but you seem to mostly reference LabsResource. Is this intentional?

Thanks @drew for responding.

This is how I define LabsResource as a factory in my services.js file:

.factory('LabsResource', ['$resource', function($resource){
  return $resource('http://192.168.1.105:3000/api/v1/labs/:labID', {labId: '@id'});
}]);

The intention was to share the resource between LabsCtrl (for getting an array of labs) and LabCtrl (to get a single lab).

@orthodoc No problem! So in controllers.js you reference LabsService:

.controller('LabCtrl', function($scope, LabsService, $stateParams) {
  $scope.lab = LabsService.getLab($stateParams.labId);
})

Is this supposed to be LabsResource instead of LabsService?