Skip to content

Instantly share code, notes, and snippets.

@rsgrafx
Last active August 29, 2015 13:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rsgrafx/9846923 to your computer and use it in GitHub Desktop.
Save rsgrafx/9846923 to your computer and use it in GitHub Desktop.
Angular Directive to embed gists by using url passed in as attribute.
Usage:
// <show-code url='https://gist.github.com/your-user-name/XXXXX.js'></show-code>
angular.module('yourAppName')
.directive('showCode', function () {
return {
restrict: 'E',
transclude: true,
scope: {
url: '@url'
},
link: function(scope, element, attrs) {
console.log(scope.url)
attrs.$observe('url', function(value) {
var iframe = document.createElement('iframe');
iframe.setAttribute('width', '100%');
iframe.setAttribute('frameborder', '0');
iframe.id = "gist";
element[0].appendChild(iframe);
var iframeHtml = '<html><head><base target="_parent"></head><body>'
+'<script src='+ scope.url +'></script>'+'</body></html>'
var doc = iframe.document;
if (iframe.contentDocument) doc = iframe.contentDocument;
else if (iframe.contentWindow) doc = iframe.contentWindow.document;
doc.open();
doc.writeln(iframeHtml);
doc.close();
})
}
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment