Angularjs dynamic directive inside ngrepeat

Question

Look at example:

$scope.fields = [{
    name: \'Email\',
    dir : \"abc\"
}, {
    name: \'List\',
   dir : \"ffffd\"
}];

app.directive(\'abc\', function ()          


        

Answer 1

Try this directive:

app.directive('dynamicDirective',function($compile){
  return {
      restrict: 'A',
      replace: false, 
      terminal: true, 
      priority: 1000, 
      link:function(scope,element,attrs){

        element.attr(scope.$eval(attrs.dynamicDirective),"");//add dynamic directive

        element.removeAttr("dynamic-directive"); //remove the attribute to avoid indefinite loop
        element.removeAttr("data-dynamic-directive");

        $compile(element)(scope);
      }
  };
});

Use it:

DEMO

For more information on how this directive works and why we have to add terminal:true and priority: 1000. Check out Add directives from directive in AngularJS