Question

我正在阅读angularjs.org开发者指南的指令部分，以更新我的知识并获得一些见解，我试图运行其中一个示例，但指令ng-hide不适用于自定义指令。

<my-dialog ng-hide="dialogIsHidden" on-close="hideDialog()">
  Does Not Work Here!!!
</my-dialog>
<div ng-hide="dialogIsHidden">
       It works Here.
</div>

有关为何发生这种情况的任何想法？

解决方案

似乎标签上的变量dialogIsHidden已经作出参考指令内的范围变量而不是控制器中的变量;特定该指令具有自己的曝光范围，使这项工作成为必要通过引用控制器的变量dialogIsHidden到指令。

这里是jsfiddle： http://jsfiddle.net/h7xvA/

更改时间：

 <my-dialog 
     ng-hide="dialogIsHidden" 
     on-close="hideDialog()" dialog-is-hidden='dialogIsHidden'>

和

  scope: {
    'close': '&onClose',
    'dialogIsHidden': '='
  },

Answer 1

在将对象指向范围时，您将在指令中创建一个隔离范围。这就是$ scope.dialogIsHidden未传递给指令的原因，因此该元素不会被隐藏。

Kain建议使用$ parent调整小提琴，这说明了这一点。

Answer 2

你可以改变

 <my-dialog ng-hide="dialogIsHidden" on-close="hideDialog()">

到

 <my-dialog ng-hide="$parent.dialogIsHidden" on-close="hideDialog()">

为什么ng-hide不适用于自定义指令？

2 个答案: