ng-tags-input无法从自动完成中选择选项
我在这个指令中遇到了一些问题；第一个问题是我看不到列表中的任何项。有时它会说ngRepeat有重复的值，然后即使我能看到一些东西，我也不能选择它并把它放在输入上！怎么可能呢？这是一个活塞子
http://plnkr.co/edit/vTwOqcN4pm3FgKLYlLu9?p=preview
顺便说一下，这是html代码部分：
<body ng-controller="MainCtrl">
<tags-input ng-model="tags"add-from-autocomplete-only="true">
<auto-complete min-length="1"
source="loadTags($query)"
template="my-custom-template"></auto-complete>
</tags-input>
<p>Model: {{tags}}</p>
<script type="text/ng-template" id="my-custom-template">
<div class="right-panel>
<span ng-bind-html="$highlight($getDisplayText())"></span>
<h1 style="font-size: 15px!important" class="uk-margin-remove">
{{data.name}}
</h1>
</div>
</script>
</body>这里是angular：
var app = angular.module('plunker', ['ngTagsInput']);
app.controller('MainCtrl', function($scope, $http) {
$scope.tags = [];
$scope.loadTags = function(query) {
return $http.get('tags.json', {
cache: true
}).then(function(data) {
$scope.names = data.data.data;
return $scope.names;
});
};
});回答 3
Stack Overflow用户
发布于 2015-07-03 00:09:54
我已经解决了你的问题，并以一种简单的方式找到了解决方案。我已经测试过了，它工作正常。我希望这就是你要找的。
Angular脚本文件
var app = angular.module('plunker', ['ngTagsInput']);
app.controller('MainCtrl', function($scope, $http) {
$scope.tags = [];
$scope.names = [];
$scope.loadTags = function() {
return $http.get('tags.json').then(function(response) {
var data = response.data.data.data;
$scope.names = [];
for (var tag in data)
{
$scope.names.push(data[tag].name);
}
return $scope.names;
});
};
});HTML文件
<tags-input ng-model="tags" add-from-autocomplete-only="true">
<auto-complete min-length="1"
source="loadTags()"
template="my-custom-template"></auto-complete>
</tags-input>
<p>Model: {{tags}}</p>Stack Overflow用户
发布于 2015-07-03 00:03:39
你的代码看起来不错。我看到的唯一问题是，在你的文本中，你的文本对象应该是{id: idVal，data.data : nameVal}的形式。也就是说，显示字段名称应该是'text‘而不是' name’。
Stack Overflow用户
发布于 2016-08-10 15:54:46
使用这个柱塞
http://plnkr.co/edit/QFjUPSUENc8RiqipRT28?p=preview
使用key-property = "id" and display-property="name去掉重复错误，并显示列表
https://stackoverflow.com/questions/31188869
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号