Loading static JSON data from the rendered page into AngularJS

In our scenario we didn’t wanted to build a whole single page application but instead needed to deal with data after the post was send to the server but didn’t save for some reason, so the page is rendered again and the data shown again as well. This caused the Angular controller to lose it’s set data.

I was looking for a way to prevent this and injecting any kind of data into my Angular app. I finally came up with a small directive that will read the json data, decode it and set it to a given scope variable.

This is the small directive that will load your data in your controllers scope:

In your applications code, in this case php, you can now do this:

If any one knows a better way to deal with this scenario I’m open for any suggestions and criticism!