在嵌套的Angular指令中，child指令是否可以从父级的隔离范围继承变量？

让我解释我想要做的事情。我想要有以下html：在嵌套的Angular指令中，child指令是否可以从父级的隔离范围继承变量？

<outer data="variableFromAppController"> 
    <inner></inner> 
</outer>

variableFromAppController是我的主应用程序的控制器范围上的变量。我知道我可以通过这样的指令是这样的：

.directive('outer', [function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: { 
     data: '=' 
    } 
    } 
}]);

传递数据属性通过一个孤立的作用域效果很好！但我的问题是，我想我的内部指令也意识到父指令的范围上的这些数据。

如果内部指令没有声明范围，它将继承应用程序控制器的范围，而不是外部指令。有没有办法让我继承这个孤立的范围？甚至只是访问它并观看“数据”的变化？

来源

2014-05-16 paulcpederson

看看这里http://stackoverflow.com/a/23438272/3255740 – starchild

是的！只需将transclude: true放在父指令中，并手动将范围传递给父链接函数中的transclude函数。这是一个基本的plnkr。

app.directive('outer', function(){ 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: { 
     data: '=' 
    }, 
    transclude: true, 
    link: function(scope, elem, attr, nullCtrl, transclude){ 
     transclude(scope, function(clone){ 
      elem.append(clone); 
     }); 
    } 
    } 

}); 


app.directive('inner', function(){ 
    return { 
    restrict: 'E', 
    replace: true, 
    link: function(scope){ 
     console.log(scope.data) 
    } 
    } 
});

来源

2014-05-16 17:52:34 javaCity

这夫妻'inner'指令'outer'，它有到控制器的范围不再访问。否则一个不错的方法。 – zeroflagL

实际上，将内部耦合到外部正是我所希望的。可能不适合每个人，但对我来说，这是完美的！谢谢@javaCity – paulcpederson

要共享资源，您还可以在外部指令中使用'controller'。这是进行指令间通信的最佳方式，并且比上述解决方案更具可读性。 – javaCity

如果你希望你的内心指令范围，有机会获得母公司的范围，然后，而不是宣布你的指令的分离范围，尝试宣告范围使用原型范围继承。你可以通过指定“scope：true”来做到这一点。

app.directive('inner', function(){ 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: true, 
    link: function(scope){ 
      console.log(scope.data) 
      } 
     } 
});

来源

2014-05-21 15:06:03 SomeoneHelpful

在嵌套的Angular指令中，child指令是否可以从父级的隔离范围继承变量？

回答

相关问题