Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Keith Boynton 19 posts 61 karma points
    Jun 25, 2020 @ 07:38
    Keith Boynton
    0

    Getting the media service in a Content App

    Hi,

    I'm trying to get the media service from inside a content app in v8.6.1

    I was hoping that it could be injected like this:

    angular.module("umbraco")
        .controller("My.ContentApp", function ($scope, editorState, userService, contentResource, mediaService)
    

    But mediaService just raises the following error:

    Error: "[$injector:unpr] Unknown provider: mediaServiceProvider <- mediaService <- My.ContentApp
    

    Does anyone know how I can get the media service injected?

  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    Jun 25, 2020 @ 20:54
    Jan Skovgaard
    0

    Hi Keith

    I think it's because it's not called "mediaService" in the Umbraco frontend - It appears to be in the backend C# though - I think what you're looking for is the mediaResource

    So your snippet should look like this

    angular.module("umbraco")
        .controller("My.ContentApp", function ($scope, editorState, userService, contentResource, mediaResource)
    

    I hope this helps!

    /Jan

  • Keith Boynton 19 posts 61 karma points
    Jun 26, 2020 @ 08:14
    Keith Boynton
    0

    Thank you Jan, that's really helpful, I did find this...

    https://our.umbraco.com/apidocs/v8/ui/#/api/umbraco.services

    That seems to list the services that are available in the UI, however I didn't find anything in that list that looked like it would provide what I needed.

    I'll give your suggestion a spin though, thank you!

  • Keith Boynton 19 posts 61 karma points
    Jun 26, 2020 @ 15:49
    Keith Boynton
    0

    So I gave your suggestion a spin and actually the mediaResource you mentioned is listed in that doc.. shame on me for missing it :)

    However, I'm still being an idiot and not able to work out how to display a media image in a content app.

    I have a media picker property, from which I can get the media path:

    properties[3].value gives me:

    umb://media/e40086a316bc4a3e8ef8ba42764ee397
    

    I can't seem to get the id of the referenced media so I can't use:

     mediaResource.getById()
    

    and there doesn't seem to be a getByPath()

    I'm trying to get the media item url so I can display it like this:

     <img ng-src="{{vm.CoverArt}}" />
    
  • Bo Jacobsen 605 posts 2403 karma points
    Jun 26, 2020 @ 17:55
    Bo Jacobsen
    0

    Hi Keith.

    With Udi i think you need to use the entityResource like

    entityResource.getById(umb://media/e40086a316bc4a3e8ef8ba42764ee397, "Media")
       .then(function(ent) {
           var myDoc = ent;
           alert('its here!');
       });
    
  • Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib
    Jun 26, 2020 @ 18:36
    Jan Skovgaard
    100

    Hi Keith

    It's a bit weird but you should be able to pass the udi to the mediaResource.getById(), which is not very obvious - But it should work.

    I hope this helps.

    /Jan

  • Keith Boynton 19 posts 61 karma points
    Jun 27, 2020 @ 06:25
    Keith Boynton
    0

    @bo Thank you for that suggestion.. it does work however that only returns a basic object and there aren't any really useful properties on it for my needs at least.

    @Jan You're right! That does work indeed and I get the media object with everything I need. There's a property called mediaLink on the returned object (not url as I was expecting) that gives me a working link for the media.

    Thank you very much!

Please Sign in or register to post replies

Write your reply to:

Draft