Render a directive inside another directive (within repeater template)

Question

I am trying to render a directive inside another directive (not sure if the repeater inside the template is working this), and it seems to just output as text rather than compil

Answer 1

I managed to work around this issue by re-writing the code:

First I updated the template code as follows:

template: '
' +
          '    
' +
          '        
' +
          '    
' +
          '
',

Note that I created a new 'view' directive. Next the view directive definition as follows:

app.directive('view', ['$compile', function (compile) {

    return {
        restrict: 'A',
        scope: {
            view: '@'
        },
        replace: true,   
        template: '
',

        controller: ['$scope', function (scope) {
            scope.$watch('view', function (value) {
                scope.buildView(value);
            });
        }],

        link: function (scope, elm, attrs) {

            scope.buildView = function (viewName) {
                var view = compile('
')(scope);
                elm.append(view);
            }
        }
    }
}]);

So essentially, the view.dir variable is passed as an attribute to the 'view' directive, which then watches it's value and compiles a template with the directive in it.