0

我遇到了自定义角度指令的问题。基本上,在下面的示例中,如果在指令范围之外,变量“name”将正确呈现,但在指令范围内则不会。

模板:

<div ng-controller="swygController">
  <div swyg="example" edit="load(id)">
    {{name}}
  </div>
  {{name}
</div>

指示:

swyg.directive('swyg', function(){
  return {
    restrict: 'A',
    scope: {
      edit: '&'
    },
    compile: function(elm, attr){
      // Code
    },
    controller: function($scope, $element, $attrs) {
     // Code
    }
  };
});

我已经用空的 compile 和 controller 指令函数对此进行了测试(以排除我的指令中导致问题的某些内容)并得到相同的结果。

我相当肯定这是一个范围问题,但无法弄清楚如何解决它。似乎我需要以某种方式允许指令继承控制器的范围?我认为既然指令在控制器内部,那就没问题了。

有没有其他人遇到过这个?

谢谢你的帮助!

4

2 回答 2

0

一旦您scope在指令中声明它就是一个孤立的范围,因此来自父范围的变量是不一样的。

有几种方法可以接近:

一种是在表达式中使用父范围。嵌套范围嵌套在父对象中,因此您可以执行以下操作:

{{$parent.name}}

如果嵌套深度为 2 层,则可以使用$parent.$parent.name,但这种方法会变得丑陋

或者将变量作为属性传递给指令,并以与您相同的方式将其包含在指令范围中edit

于 2013-10-26T21:14:57.377 回答
0
scope: { }

创建一个隔离范围,这意味着您无法访问父范围及其上定义的所有内容。

您可以使用 $parent.name 访问父范围名称变量。但我不建议使用 $parent 遍历范围。

而是将名称作为属性传递给您的指令。

我创建了一个 plunker 来演示如何执行此操作: http ://plnkr.co/edit/NGNMfkgNMooq0Sul6HPH?p=preview

于 2013-10-26T21:43:21.990 回答