将jsfiddle代码绑定到angularjs模型

Question

I have created a front end using angularjs. In the form I want to let the user enter the javascript code for which I am using embedded JSfiddle.

    <iframe style="width: 100%; height: 300px" 
    src="http://jsfiddle.net/zalun/NmudS/embedded/"></iframe>

With jsfiddle they can enter the code and check the result there it self.

I want to get save that code when the user submits the form. How can I do that?

or Suggest any other alternative of jsfiddle which will serve my purpose.

Answer 1

The JSFiddle code is within an iframe, so doing a traditional Angular binding will be impossible. I looked around, and neither Codepen nor JSFiddle have support for both editing in an embed and downloading the raw resources that make up the pen. However, both Codepen and JSFiddle have API support for remote creation of pens. This is obviously a worse experience, but you could have the code form on your site provide a button which opens the user's code on Codepen or JSFiddle for testing, but they still submit the form on your site.

Codepen API: https://blog.codepen.io/documentation/api/prefill/

JSFiddle API: http://doc.jsfiddle.net/api/post.html