Question

我有新的实现要求，所以我必须根据条件渲染指令。

<div ng-app="myApp">

  <body-dir>

    <icon-dir> 
    </icon-dir>

    <filter-dir>
     </filter-dir>

    <widget-dir ng-if="someCondition">
    </widget-dir>

  </body-dir>
</div>

从上面的指令结构中，我尝试根据'widget-dir'属性呈现someCondition。

Todo，我从<filter-dir>发出了该事件，并在widget-dir中捕获了无效的事件。

如果我删除了ng-if它工作正常。

我从各种来源了解的内容：

ng - 如果创建新范围。但根据角度doc，新创建的范围将从父级继承。

那么，它应该共享body-dir范围？如果它被共享，那么我们从<filter-dir>发出的事件应该是widget-dir？

以上功能正常工作如果删除ng-if。在这里，我无法理解到底发生了什么。

我知道$emit事件的目的是捕获父级中的事件。之前我在一个兄弟姐妹中捕获了这个事件，因为它是从父范围共享的（这是最佳做法吗？）。

更新：这里还有一件事我注意到，如果我将ng-if放在指令子元素（不是指令）上，那么它就按预期工作了。在下面的代码中，我将ng-if放在模板元素上。在这里，我只是想了解角度范围如何与ng-if一起使用。

angular.module('app').directive('widgetDir', function(){
  return {
    template: '<br><span ng-if="true">I\'m in "ng-if"</span>',
    link: function(scope, element, attrs){
  scope.$on('evt-filter', function(evt, data){
    alert(data);
  });
    }
  }
})

任何人都可以清楚这一点。

重现性问题 here

Answer 1

选项1：当你发出它时，可能是它在DOM中的NOT。如果可以的话，试试ng-show。

选项2：

$ broadcast而不是$ emit 在您的控制器中执行：

$ rootScope。$ broadcast（'PHOTO_UPLOADED'，照片）;

并在您的指令中，通过

捕获广播事件

$ rootScope。$ on（'PHOTO_UPLOADED'，function（event，data）{ thumbnail =数据; }）;

$ emit事件不适用于ng-if

1 个答案: