javascript - How can I assign different ng-model values to several input fields created from one directive -

i created directive dinamically add different form fields. problem once add more 1 directive based field, ng-model duplicated. i'm new working directives,hope can help.

    var app = angular.module('app', []);       angular.module('app').controller('mainctrl', function ($scope, $compile) {      $scope.add = function(ev,attrs){//$on('insertitem',function(ev,attrs){       var iact = angular.element(document.createelement('itemactivo'));       var el = $compile( iact )( $scope );        //where want place new element?   angular.element(document.body).append(iact);    $scope.inserthere = el; };  });   // directive angular.module('app')  .directive('itemactivo', function () {    return {       templateurl: 'itemactivo.html',       restrict: 'e',       link: function postlink(scope, element, attrs) {         }         };        }); 

i created plunker problem

http://plnkr.co/edit/idd5kfo7ueonp8csun33?p=preview

add scope: true in itemactivo directive. code should below:

angular.module('app')   .directive('itemactivo', function () {     return {       scope:true,       templateurl: 'itemactivo.html',       restrict: 'e',       link: function postlink(scope, element, attrs) {        // element.text('this chart');       }     };   });