那捣鼓说明问题http://jsfiddle.net/LAqeX/2/NG-如果transcluded范围破坏范围继承
我想创建一个包装的页面的一部分,它隐藏了一个指令。我想用ng-if来删除不必要的绑定。但是一些黑魔法发生了。
这是我更喜欢的指令代码。
app.directive('withIf', function(){
return {
restrict: 'E',
scope: {
title: '@'
},
transclude: true,
template: '<div>' +
'<p ng-click="visible = !visible">{{title}}</p>' +
'<div ng-if="visible" ng-transclude></div>'+
'</div>',
link: function(scope){
scope.visible = false;
}
}
});
它应该创建两个范围:
- 指令隔离它有两个变量的作用域 - 标题和可见
- Transcluded范围由prototypically从“常规”范围树继承。
但是,ng-if使得transclued作用域与现实有些分离,而trasncluded作用域并不从控制器继承。请看小提琴,这个问题很清楚。
任何想法发生了什么,以及如何解决它?
UPDATE
看来我也想通了,原因作用域链看起来破碎。由ng-if创建的范围属于withIf指令隔离分支。所以它从不知道控制器的范围甚至存在。但是问题依然如此 - 如何在这种情况下使用ng-if。
不ng-if创建隔离范围,更具体地说? – frishi
它的确如此,但我没有想到它会打破应该是文学上的$ parent的transcluded范围继承。这在Angular 1.3中是固定的,所以如果你有类似的问题就升级。 –
我确实有类似的问题,并使用ng-show解决它。由于我正在使用的应用程序的大小,升级不是一个选项。到那时,为什么ng-if最好是ng-show?我知道ng-show只是添加了一个隐藏DOM的东西,而不是完全删除它的类。 ng-if的优势在哪里? – frishi