ディレクティブを別のディレクティブに属性として渡すには？ AngularJS

Question

アイデアは、私はをループする必要があること、ディレクティブのリストを持って、次のように動作する必要があることを

//This is pseudo code: 
directives = [directive1, directive2, directive3] 
<ng-repeat directive in directives> 
    <main-directive attribute = "{{directive}}"> 

    </main-directive> 
</ng-repeat> 

です。問題は、各カスタムディレクティブを1つずつ追加する必要があるため、メインディレクティブにハードコードを記述することはできません。

Answer 1

使用カスタムディレクティブで$compile service：

app.directive("dynamicComponent", function($compile) { 
    return { 
    link: postLink 
    }; 
    function postLink(scope, elem, attrs) { 
    var comp = scope.$eval(attrs.componentName); 
    var html = ` 
     <${comp}> 
     </${comp}> 
    `; 
    var linkFn = $compile(html); 
    elem.append(linkFn(scope)); 
    } 
}); 

使用法：

<div ng-repeat="name in ['comp-a','comp-b']"> 
    <dynamic-component component-name="name"> 
    </dynamic-component> 
</div> 

DEMO on PLNKR