Copied to clipboard

Flag this post as spam?

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


  • David Jazbec 23 posts 145 karma points
    Jul 19, 2023 @ 08:11
    David Jazbec
    0

    ng-bind-html (Block Grid - Backoffice)

    Hi everybody,

    i have this one Grid Block with a string property which holds a html-formatted value. (for instance Youtube iframe).

    Now the frontend is not a problem rendering it with Html.Raw().

    I have trouble generating html in the backoffice Custom view. This snippet does not seem produce any result.

    <div class="codeBlock" ng-bind-html="block.data.embedCode">
    
    </div>
    

    I dont really have any experience with Angular so any help would be really welcome.

    Disclaimer: I know allowing Editors to input html/js in this way could be dangerous. But this is for my own personal website so i am not worried too much.

    Thanks! David

  • Marc Goodson 2157 posts 14435 karma points MVP 10x c-trib
    Jul 19, 2023 @ 09:53
    Marc Goodson
    100

    Hi David

    There used to be an ng-bind-html-unsafe option in earlier angularJS versions but I think that's removed, now, I think you need to inject $sce service into your angularJS controller and use $sce.trustAsHtml(yourHtml); before it can be safely bound...

    ... I think ...

    ... I mean at times it just feels like voodoo ...

    Anyway looking in the Umbraco source, I found this filter called 'safe_html':

    https://github.com/umbraco/Umbraco-CMS/blob/a49a9851dc81677637ec1823963c50d84ef360f3/src/Umbraco.Web.UI.Client/src/common/filters/safehtml.filter.js#L3

    So I'm wondering if you can 'just' use that eg:

     <div ng-bind-html="block.data.embedCode | safe_html"></div>
    

    fingers crossed

    Marc

  • David Jazbec 23 posts 145 karma points
    Jul 19, 2023 @ 10:42
    David Jazbec
    0

    This did it! Thank you Marc!

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies