Is it possible to do reusable snippets within Angular templates?

Question

Is it possible to do reusable snippets within Angular templates?

I'm finding myself repeating the same snippets of code again and again, is it possible to do something like this in angular:

<div ng-snippet="mySnippet"> 
  This is a snippet 
</div> 

<div ng-snippet="anotherSnippet"> 
  Yet another snippet!!
</div>

<ng:include src="anotherSnippet">
<ng:include src="anotherSnippet">
<ng:include src="mySnippet">

and the output of the above would be:

Yet another snippet!!
Yet another snippet!!
This is a snippet

I'm not necessarily looking for this exact "ng:include" solution or pattern but something that would reduce the repetition in my templates.

javascript
angularjs

Answer 1

<script type='text/ng-template' id="mySnippet"> 
    This is a snippet 
</script> 

<script type='text/ng-template' id="anotherSnippet"> 
    Yet another snippet!!
</script>

<ng-include src="'anotherSnippet'"></ng-include>
<ng-include src="'anotherSnippet'"></ng-include>
<ng-include src="'mySnippet'"></ng-include>

This should be what you want.

Docs for script and ng-include.

Answer 2

This sounds like you want to use directives. Here is a simple example: http://jsfiddle.net/gyF6V/1/