Angular:ui-select。使用`refresh`功能自定义标记

时间:2015-03-03 15:44:56

标签: javascript angularjs angular-ui-select

我需要输入多选的能力。问题是数据在用户点击时动态地来自服务器,如果没有找到合适的数据,我需要创建一个新标签。 代码示例:Getting addresses

当前示例不显示标签内的信息,如果输入新信息,则不显示标题tagging-label="(custom 'new' label)"(例如,您可以输入类似" blablablabla &#34的内容;,服务器应该什么也不返回)

如何处理? 我可以将所有结果保存到数组并使用数组而不是服务器的解决方法对我不起作用...

1 个答案:

答案 0 :(得分:5)

当你使用多个时,你需要在ui-select-match

中使用$ item

您需要使用自定义函数来创建新项目(例如“blablabla”)。 您可以在ui-select

的标记属性中执行此操作

您需要的代码是这样的:

<ui-select multiple tagging="tagTransform" ng-model="myCompetences.competences" theme="bootstrap" ng-disabled="disabled" style="width: 800px;" title="Choose a person">
<ui-select-match placeholder="Select a address...">{{$item.formatted_address}}</ui-select-match>
<ui-select-choices repeat="address in addresses track by $index"  refresh="refreshAddresses($select.search)" refresh-delay="0">
<div ng-if="address.isTag" ng-bind-html="'<small>(new)</small>'"></div>
  <small>
    {{address.formatted_address}} 
  </small>
</ui-select-choices>
</ui-select>

您可以在示例中进行修改:http://plnkr.co/edit/CQkuSMQub9S81hSRueO1

这里有一个有用例子的plnkr: http://plnkr.co/edit/m1SQXUxftBLQtitng1f0

如果您想将信息添加到服务器或类似的内容,我建议您使用on-select事件。