ng-if函数在Click上调用

Question

我在Plnkr上有我的代码：

http://plnkr.co/edit/6wz4zub2sEOfhrqps0c8

html代码非常简单：

   <div ng-app="myApp" ng-controller="MainCtrl">
     <div ng-dropdown-multiselect="" options="myData" selected-model="myModel" extra-settings="mySettings" events="myEvents"></div>
       <div ng-repeat="item in Items">
         <item-input></item-input>
       </div>      
     </div>
   </div>

基本上，问题是我在每次点击页面上的任何地方时都会调用ng-if函数。我认为这与多选控制有关，但我不知道应该在哪里修复它。任何帮助表示赞赏。

感谢。

已更新

我不明白为什么当我注释掉多选下拉列表（<div ng-dropdown-multiselect="" options="myData" selected-model="myModel" extra-settings="mySettings" events="myEvents"></div>）时此行为会停止？

Answer 1

如下图所示，取自Chrome DevTools，多选下拉列表生成两个点击事件处理程序：

一个事件在按钮上，一个在整个文档上。因此，单击文档至少会触发最后一个事件处理程序，这可能会更改模型。 Angular然后执行摘要循环，这意味着在不删除DOM的元素的情况下，将评估绑定到displayMe指令的ngIf函数。

如果删除下拉组件，从而删除这两个单击处理程序，则会留下3个文本输入。实际上，现在单击文档后没有摘要，因为没有执行处理程序，但您仍然可以通过在输入元素内输入来完全触发摘要。

This answer by Miško Hevery有一些关于Angular 1.x中脏检查过程的重要信息。