AngularJS - como ter uma diretiva com uma sub-diretiva dinâmica

Realmente lutando com isso - tentei de todas as maneiras que posso pensar. Espero que alguém possa ajudar.

Eu tenho uma diretiva que cria o contorno de um controle personalizado para mim. A parte central do controle personalizado deve ser representada por uma diretiva gerada dinamicamente com base no valor de uma variável de escopo na diretiva externa. A variável de escopo contém o nome da diretiva interna. Estou fazendo isso porque minha página terá vários elementos gerados dinamicamente, todos com um layout comum, mas com conteúdo interno diferente.

ou seja, um exemplo da minha diretiva externa:

<div data-inner="{{inner}}">
    <!-- div content here --->
<div {{inner}} />

{{inner}} está definido para o nome de uma nova diretiva - neste casosearch. Minha página deve se tornar:

<div data-inner="search">
    <!-- div content here --->
<div search />

comsearch no div inferior sendo também substituído pelo conteúdo dessa directiva.

Alguma ideia?

ATUALIZAR Aqui está um básicojsFiddle representando o problema que tenho - note que o terceiro div não é exibido.

questionAnswers(2)

yourAnswerToTheQuestion