2015-06-21 2 views
0

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

HTML:

<tags-input ng-model="compose.receiver" 
      add-from-autocomplete-only="true" 
      min-length="1"> 
    <auto-complete source="loadReceiver($query)" 
        min-length="0" 
        debounce-delay="0" 
        max-results-to-show="10" 
        loadOnEmpty="true"> 
    </auto-complete> 
</tags-input> 

Контроллер:

$scope.loadReceiver = function(query){ 
    return AdminInbox.loadReceiver(query); 
} 

Услуги:

angular.module('inboxes').factory('AdminInbox', ['$http','$q', 
    function($http,$q) { 
    return { 
     loadReceiver: function(query) { 
     console.log(query); 
     var deferred = $q.defer(); 
     var receiver = $http.get('mailreceiver/'+query); 
     console.log(receiver); 
     return deferred.promise; 
     } 
    } 
    } 
]); 

и я успешно получить ответ в ниже формате:

[{_id: "5579c9a4f3d71f8c2a4f1e3d" email: "[email protected]"}, 
{_id: "557f2cd3a571f9a41e4168f2" email: "[email protected]"}] 
+0

Ваш JSON кажется недействительным. Вы уверены, что при анализе результата ошибки JS нет? Свойства разделены запятой. После краткого просмотра ngTagInput я думаю, что объекты ответа должны содержать свойство ** text **. '[{" text ":" aaaaaa "}, {" text ":" bbbbb "}]' – Michael

+0

, так это значит, что keyName для текста действительно необходимо? не могу ли я настроить динамический ключ, как электронная почта? –

+0

Не знаю. Проверьте API-интерфейс ngTagInput. Есть тихая куча свойств – Michael

ответ

1

Имейте действительный JSON и установите display-property, и он работает!

angular.module('app', ['ngTagsInput']) 
 
    .run(function($rootScope) { 
 
    $rootScope.source = [{ 
 
     _id: "5579c9a4f3d71f8c2a4f1e3d", 
 
     email: "[email protected]" 
 
    }, { 
 
     _id: "557f2cd3a571f9a41e4168f2", 
 
     email: "[email protected]" 
 
    }]; 
 

 
    $rootScope.compose = { 
 
     receiver: [] 
 
    }; 
 
    });
<link rel="stylesheet" href="http://mbenford.github.io/ngTagsInput/css/ng-tags-input.min.css" /> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.24/angular.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-tags-input/2.3.0/ng-tags-input.js"></script> 
 
<div ng-app="app"> 
 
    <tags-input ng-model="compose.receiver" display-property="email" add-from-autocomplete-only="true" min-length="1"> 
 
    <auto-complete source="source" min-length="0" debounce-delay="0" max-results-to-show="10" loadOnEmpty="true" displayProperty="email"> 
 
    </auto-complete> 
 
    </tags-input> 
 
</div>