Copied to clipboard

Flag this post as spam?

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

  • alimac 182 posts 370 karma points
    Apr 10, 2017 @ 16:50

    Best practice for angular with custom backoffice sections

    I've been following some tutorials to setup a custom section in the backoffice. I've managed to create a new section, add a tree controller and load a custom angular view.

    This works fine for me if the view I'm using shows pretty basic content, but I question what the best practices are for handling more complex situations?

    In my current scenario, I have an angular view that displays a list of members. But what if I want to have this listview click through to member details?

    At the moment I handle all the functionality within a single controller, showing the list view when I want to list all members, then hiding it and displaying a single member's details on the page when I drill down, but I'm not sure if this is ideal.

    Since angular apps pretty much work off a single html page, loading in the appropriate views, I wonder if this is the approach I should use for my custom sections? Should one of my custom section views be treated as a standalone angular app? ie. should I use angular's routing and state provider to handle all the different views I may use, or should it be divided out into separate views, using umbraco's routing to handle the different sections?

  • Jamie Pollock 174 posts 853 karma points c-trib
    Apr 10, 2017 @ 19:24
    Jamie Pollock

    Hey Alimac,
    You have two options really. You could do as you say as and using angular routing to pass the relevant information needed to view a single member's data or alternatively you could leverage the <umb-overlay /> directive or dialog service.

    I'd recommend you use the routing approach if you're going to have a lot of information on a member (eg. multiple tabs or more than 5 properties).

    For a quick view of a member information the overlay is perfect as it takes up a small potion of the screen.

    If you need any implementations of these let me know. Otherwise check out the following API docs:


  • alimac 182 posts 370 karma points
    Apr 10, 2017 @ 19:30

    Jamie, you're a mind reader! I was literally trying to get a modal service to work with the back-end just now but had to give it up as there were issues with the angular versions used in the back end.

    I didn't even realise the umbOverlay directive existed - it's exactly what I'm looking for in this scenario...

    I wish I could high-five you again. Thanks so much!

  • Jamie Pollock 174 posts 853 karma points c-trib
    Apr 10, 2017 @ 19:43
    Jamie Pollock

    Glad I could help :) umbOverlay is pretty cool and a bit more flexible than dialogService.

    Happy Umbracoing! #h5yr!

Please Sign in or register to post replies

Write your reply to: