Hi Johannes

To achieve this you need to add a custom angularJS controller to your custom view, where you can then use the mediaResource to retrieve details of the media item from the Udi.

So first off we need to tell Umbraco to load the custom AngularJS controller, create a folder in your /App_Plugins/ folder for your custom block eg

/App_Plugins/CustomBlock/

in here create a file called package.manifest

(Umbraco looks for all package.manifest files in the app_plugins folder during startup, and loads any resources they specify)

in your package.manifest add a reference to your custom controller eg

{
  "javascript": [
    "~/App_Plugins/CustomBlock/customBlock.controller.js"    
  ]  
}

(that is all you need)

Now create your customBlock.controller.js file in your CustomBlock folder, and add the following angular controller definition, note how we 'inject' the mediaResource service:

angular.module("umbraco").controller("customBlockController", function ($scope, mediaResource) {

    //your property is called image so the following will contain the udi:
    var imageUdi = $scope.block.data.image;
//the mediaResource has a getById method:
    mediaResource.getById(imageUdi)
        .then(function (media) {
            console.log(media);
             //set a property on the 'scope' for the returned media object
            $scope.image = media;
    });    
});

Finally you need to wire up the custom view that you picked for your block with this angular controller, which you can do using the ng-controller attribute eg:

<div ng-controller="customBlockController" ng-click="block.edit()"> 
    <img src="{{image.mediaLink}}" />
</div>

That's the gist of it anyway!

regards

Marc