You are attempting to use $http
in the directive without injecting it as a dependency. It should be included using inline injection annotation, like this:
angular.module('myApp').directive('theDirective', function($http) {...
Your $http
call makes use of the release
scope property,
$http.get('http://api.discogs.com/masters/' + scope.release.id + '/versions').
but (at least in your plunkr) you didn't include it in the directive element tag. Add it like this:
<div the-directive release="release" ng-repeat="release in releases...
Finally, your directive displays the results of the $http
call in a dynamically created element. To achieve binding in this element, you need to compile it. So add $compile to the list of directive dependencies:
angular.module('myApp').directive('theDirective', function($http, $compile) {...
When you are finished manipulating the DOM, compile the element:
var collapse = angular.element('<div>' ...
...
$compile(collapse)(scope);
I fixed a few other things, but they don't really relate to using $http
in a directive. Here is a working plunker: http://plnkr.co/ttV0ZowaL8Tyz1hAkZak