javascript - loop through the provided attributes -

i new angular, have requirement need add many custom attributes custom element directive, <radio-button>. currently, doing this:

<radio-button one-attr="some value" two-attr="some string" three-attr="some other string"><radio-button> 

i have many radio buttons on page , writing custom attributes each custom directive on page looks messy. so, looking alternative can pass javascript array object loops on each radio-button custom directive.

for example: (in controller)

  $scope.values = [{        'one-attr': 'some value',        'two-attr': 'some other value',        'three-attr': 'another value',        /* , on... */   },   {        /* custom attribute set */   }   /* on */   ] 

and custom directive, pass custom attribute directive shown below:

  <radio-button ng-repeat="(key, value) in values" loop-attributes="key, value"></radio-button> 

where above loop-attributes custom attribute directive applied custom element directive.

please suggest how this.

if going wrong please suggest me how handle this.

you have use $compile service radiobutton custom directive. have parent directive has list of attributes , within directive create radiobutton element attributes , compile it. have used input type example.

http://plnkr.co/edit/7anndiuhcfagyjwkw7sa?p=preview

// custom element .directive('custominput', function() {   return {     replace: true,     restrict: 'e',     template: '<input type="text"></input>'   }; })  //wrapper directive .directive('custominputattr', function($compile) {   return {     restrict: 'e',     link: function(scope, element, attrs) {       // set in controller       scope.elemattrs = [{         'class': 'class1',         'ng-model': 'input1'       }, {         'class': 'class2',         'ng-model': 'input2'       }];        angular.foreach(scope.elemattrs, function(elemattr) {         var custominputelem = angular.element('<custom-input></custom-input>');         angular.foreach(elemattr, function(value, key) {           custominputelem.attr(key, value)         });        var elem = $compile(custominputelem)(scope);       element.append(elem);       });      }   }; })