Directive works with TemplateUrl but not Template - angularjs

Question

This is a strange one. I am new to angular, only been learning for a week or so.
I have two directives.
The first:
app.directive('block', function() {
return {
restrict: 'E',
replace: true,
scope:true,
link: function(scope, element, attrs) {
scope.blockCss = function() {
return attrs.block;
}
scope.blockSize = function() {
return attrs.blocksize;
}
scope.category = function() {
return attrs.category;
}
},
templateUrl: function(elem,attrs) {
return attrs.block + '.html';
}
}
});
This works perfectly on an element called:
<block blocksize="3" category="foo1" blockcss="bar1"></block>
Now the kicker.
An identical directive but changing from TemplateUrl to Template so as to have something more dynamic:
app.directive('block', function() {
return {
restrict: 'E',
replace: true,
scope:true,
link: function(scope, element, attrs) {
scope.blockCss = function() {
return attrs.block;
}
scope.blockSize = function() {
return attrs.blocksize;
}
scope.category = function() {
return attrs.category;
}
},
template: function(elem,attrs) {
return '<div class="blocksize{{blockSize()}} {{blockCss()}}" ng-repeat="item in items | orderByPriority | filter:{category:category()} | orderBy:myorder" ng-include src="\'{{blockCss()}}.html\'"></div>';
}
}
});
I might be an idiot but if someone could point out to me what I am missing I would appreciate it.
Further to the above, I would like to be able to refer to the attributes in the element (e.g. the 'block' element) inside the template or template URL - that is why I have the scope definitions (which need to be scope children).
Really looking forward to any kind of reply.