Skip to content

Instantly share code, notes, and snippets.

@fliedonion
Created October 30, 2015 02:56
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 fliedonion/b7b3f0c470e1f55dbb4e to your computer and use it in GitHub Desktop.
Save fliedonion/b7b3f0c470e1f55dbb4e to your computer and use it in GitHub Desktop.
angular compile usage
var app = angular.module('app',[]);
app.directive('compileBold', function($compile){
return{
restrict: 'E',
link: function(scope, element, attr){
console.log(element.html());
element.html('<b>bold text</b>');
$compile(element.contents())(scope);
}
};
});
app.directive('compileP', function($compile){
return{
restrict: 'E',
link: function(scope, element, attr){
console.log(element.html());
element.html('<compile-c></compile-c>');
$compile(element.contents())(scope);
}
};
});
app.directive('compileC', function($compile){
return{
restrict: 'E',
template: '<div>child item</div>'
};
});
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<script src="angular-compile.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-app="app">
<compile-bold></compile-bold>
<compile-p></compile-p>
<compile-c></compile-c>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment