javascript - 这个 Angular select2 示例是某种巫术还是什么?

标签 javascript angularjs angular-ui angularjs-select2

我正在看这个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 与 bool 值(我假设是 bool 值)连接起来 person.isTag ?顺便说一句,这个示例是我在 angularjs select2 文档页面上找到的那个示例的分支,我只是删除了所有其他示例。 this is original plunker

enter image description here

最佳答案

如果person对象具有isTag,那么它会使用"(新)” 后缀。

该模板基本上定义了如何使用或不使用 isTag 属性来渲染对象。

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

isTag 引用 person 对象的属性,定义如下:

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

关于javascript - 这个 Angular select2 示例是某种巫术还是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29218162/

相关文章:

javascript - 从嵌套解析函数绑定(bind)到作用域

angularjs - $scope.myVariable 未在 angular-ui 引导模式的 Controller 中更新

javascript - AJAX - 我的简单 ajax 请求不起作用

javascript - 返回 false 后确认对话框不起作用

angularjs - Uncaught Error : Template parse errors: Can't bind to 'columnMode' since it isn't a known property of 'ngx-datatable'

javascript - AngularJS 句子和字数统计的两种数据绑定(bind)

angularjs - 使用选项组时,如何使用 Angular UI 正确初始化 Select2 标签?

javascript - angularjs ui-sortable : cannot call methods on sortable prior to initialization; attempted to call method 'refresh'

javascript - Jquery 添加和删除表格行

javascript - 使用 JQuery 将值从表复制到模态