2015-06-21 217 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

我不知道。请检查ngTagInput API。有一些属性安静 – 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>