AngularJS ng-include

HTML

<div ng-controller="Ctrl">
    <div ng-repeat="item in items">
        <h2>{{item.title}}</h2>
        <div ng-include src="getTemplateById(item.id)"></div>
    </div>
</div>

<script type="text/ng-template" id="template-1.html">
  Content of template-1.html
    <div>{{item.data.body}}</div>
</script>
 
<script type="text/ng-template" id="template-2.html">
    <p>Content of template-2.html</p>
</script>

JavaScript

function Ctrl($scope) {
    $scope.items = [
        {id: 1, title: 'foo', data: {body: 'baz1'}},
        {id: 2, title: 'bar', data: {body: 'baz2'}}
    ];
    
    $scope.getTemplateById = function(id) {
        return 'template-' + id + '.html';
    };
}