javascript - Multiple-tags input field -

i started angularjs, , working on simple form tags input field , submit button. input field supposed accept multiple tags on clicking submit tags saved array.

now using ngtagsinput directive found on github(http://mbenford.github.io/ngtagsinput/). directive gives me <tags-input></tags-input> html element creates input field accepts multiple tags before submission. here like(look @ tags field):

this works fine, need directive gives me similar functionality instead of element ie. <tags-input>, want attribute can include inside conventional <input> element <input attribute='tags-input'> .

question:

1. is there way can use ngtagsinput attribute?
2. are there other directives out there may suit need? if yes please post link in answer.

thanks in advance.

no. can see on tags-input.js file, directive configured element:

return {     restrict: 'e',     require: 'ngmodel',     scope: {         tags: '=ngmodel',         text: '=?',         templatescope: '=?',         tagclass: '&',         ontagadding: '&',         ontagadded: '&',         oninvalidtag: '&',         ontagremoving: '&',         ontagremoved: '&',         ontagclicked: '&',     }, 

but can write own directive attribute type , "replace" div element tags-input element.

i wrote example:

app.directive('tagsinputattr',    function($compile){     return {       restrict: 'a',       require: '?ngmodel',       scope:{         ngmodel: '='       },       link: function($scope, element, attrs, controller) {         var attrstext = '';         $.each($(element)[0].attributes, function(idx, attr) {           if (attr.nodename === "tags-input-attr" || attr.nodename === "ng-model")              return;            attrstext += " " + attr.nodename + "='" + attr.nodevalue + "'";         });          var html ='<tags-input ng-model="ngmodel" ' + attrstext + '></tags-input>';         e =$compile(html)($scope);         $(element).replacewith(e);       }     };   } ); 

now can configure tags-input elements in 2 ways:

element way:

<tags-input ng-model="tags" add-on-paste="true" display-property="text" placeholder="add tag here..." ></tags-input> 

attribute way:

<input tags-input-attr ng-model="tags" add-on-paste="true" display-property="text" placeholder="add tag here..."  /> 

you can see in action @ plunker:

https://plnkr.co/edit/yjkx22