Storing HTML in Firebase (AngularFire), good idea or bad?

Question

Is it a good idea to store HTML in Firebase (AngularFire)?

I have a website where I am creating an admin site where users can make HTML elements. I want people to save these elements and the order and the content within the elements. So I thought it would be much easier to just store the whole HTML as a string and load it in when they return. Bad idea?

Here is what I have (simplification):

$scope.save = function() {
    var refState = new Firebase("https://<name>.firebaseio.com/users/" + currentAuth.uid + "/state");
    var html = "<div>hello</div>";
    refState.set({
        "state": html
    }, function(error) {
        if (error) {
            console.log("not been saved")
        }
    })
}

And in my HTML I retrieve want to display it like this using Angular, (yeah I know now how to render HTML in Angular thanks to the comments :)

<div class="well col-md-12">
{{sync[3].state}}
</div>

Answer 1

Storing stringified HTML in firebase is no worse than storing it in a different datastore. You'll want to consider XSS issues, including things like what if they define <style>body{display:none}</style> in their html.

Are you creating a real full fleshed content creation system? If so, it's sometimes hard to get away from user defined HTML, usually from CKeditor, tinymce, etc. However, if the items that they're building are all similar, you should consider how you can store/restore them in a better data format. Most of the time there is a better way to save and restore user defined content that storing straight HTML.