You should ng-transculde inside the inner directive since transclude replaces the inner html
angular.module('transclude', []).directive('outer', function(){
return {
restrict: 'E',
replace: true,
transclude: true,
template: '<div style="border: 1px solid black;">' +
'<div>Outer</div>' +
'<inner><div ng-transclude></div></inner>' +
'</div>'
};
});
No change to inner directive needed.
I have updated the fiddle here