Настроить ngTagsInput Autocomplete

Question

Кто-нибудь знает, как настроить макет ngTagsInput autocomplete?

<tags-input ng-model="tags" placeholder="neues Tag"> 
    <-- Customize this autocomplete layout ---> 
    <auto-complete source="loadTags($query)"></auto-complete> 
</tags-input> 

Я хочу, чтобы вставить что-то вроде этого шаблона в результате autocomple

<div> {{ Category }} : {{ TagName }} </div> 

Answer 1

В настоящее время нет никаких встроенной поддержки для этого, но вы всегда можете получить исходный код и настроить его на ваш необходимо.

Существует открытая проблема для этой функции. Вы можете отслеживать его прогресс here.

Custom templates теперь поддерживаются. Irfad Ibrahim's answer содержит дополнительную информацию.

Answer 2

У вас есть три варианта:

1. Override за $ templateCache физически имея файлы на папку, которая для этой библиотеки будет:

   $templateCache.put('ngTagsInput/tags-input.html', ' ... ' 
   $templateCache.put('ngTagsInput/auto-complete.html', ' ... ' 
   

2. Использование сценария шаблона на вашем HTML:

   <script id="ngTagsInput/tags-input.html" type="text/ng-template"> 
       <div>Whatever here</div> 
   </script> 
   

3. Инжектируйте $templateCache службы и переопределить шаблон Вашего модуля

   angular.module('myApp',[]) 
       .run(['$templateCache', function($templateCache){ 
       $templateCache.put('ngTagsInput/tags-input.html', 
        <div>Whatever here</div> 
       ); 
       }]);

Answer 3

Там является встроенная поддержка пользовательских шаблонов Autocomplete Теперь.

вы можете изменить шаблон по автозаполнения по умолчанию, установив параметр шаблона:

<auto-complete source="loadTags($query)" template="/path/custom-template"></auto-complete> 

или

<auto-complete source="loadTags($query)" template="my-custom-template"></auto-complete> 

При использовании шаблона инлайн вы можете указать, как это:

<script type="text/ng-template" id="my-custom-template"> 
    ... 
</script> 

Официальный документация здесь. http://mbenford.github.io/ngTagsInput/documentation/guides/custom-templates