javascript - 这个有角度的 select2 示例是某种巫术还是什么？

Question

我正在看这个plunkr，我简直不敢相信。您可以看到，如果数组中存在名称匹配搜索字符串的people人，则该人显示在下拉列表中，否则建议创建该(new)字符串指示的新人。但是它是如何决定显示什么元素的呢？似乎这两个有条件地显示/隐藏的 div 负责它，对吧？

<div ng-if="person.isTag" ng-bind-html="person.name +' <small>(new)</small>'| highlight: $select.search"></div>
<div ng-if="!person.isTag" ng-bind-html="person.name + person.isTag| highlight: $select.search"></div>

但是等等，这是什么？Person 对象没有 isTag 属性，或者是吗？demo.js我在里面看不到 这甚至是如何工作的？这面神秘isTag的旗帜是从哪里来的？拜托，我想我快疯了。

而且，为什么要person.name与布尔值（我假设它是布尔值）连接person.isTag？顺便说一下，这个例子是我在 angularjs select2 文档页面上找到的那个例子，我只是剥离了所有其他例子。 这是原始的plunker

Answer 1

该isTag物业来自$select.searchInput.on('keyup', function(e) {中SelectMultipleDirective。请注意，如果您multiple从代码中删除，则永远不会设置此属性。

https://github.com/angular-ui/ui-select/blob/master/src/uiSelectMultipleDirective.js#L252

Answer 2

如果person对象有isTag，那么它会呈现带有"(new)"后缀的

模板基本上定义了如何使用isTag属性渲染对象，而没有。

第一个模板——其渲染由控制ng-if="person.isTag"——在isTag属性被定义并且真实时被渲染。

isTag指的是对象的属性，定义person如下：

<ui-select-choices repeat="person in people">