Question

这是我的指令代码，工作正常：

.directive('myGrid',function(){
return {
  restrict:'E',
  scope:{
    info:'=info'
  },
  templateUrl : '/directiveGrid.html'
}

}）

这是codepen demo

但如果我更改范围如：

    .directive('myGrid',function(){
    return {
      restrict:'E',
      scope:{
        info:'@info'
      },
      templateUrl : '/directiveGrid.html'
    }
  })

它不起作用。这是第二个demo

Answer 1

以下是一些解释：

@ 将本地/指令范围属性绑定到DOM属性的计算值。由于属性值始终是字符串，因此在使用@时，您将始终在指令范围内以此属性的字符串值结束。

@允许将指令属性上定义的值传递给指令的隔离范围。

= 将本地/指令范围属性绑定到父范围属性。因此，使用=，您可以使用父模型/范围属性名称作为DOM属性的值。您不能将{{}}与=。

一起使用

=在指令的隔离范围和父范围之间设置双向绑定表达式。子范围的变化并传播到父级，反之亦然。想想=作为@和＆amp;的组合。 Screencast on =在这里：https://egghead.io/lessons/angularjs-isolate-scope-two-way-binding

是的，双向绑定（ = ）允许本地/指令范围和父范围共享数据。 “表达式绑定”允许指令调用由DOM属性定义的表达式（或函数） - 您还可以将数据作为参数传递给表达式或函数。因此，如果您不需要与父级共享数据 - 您只想调用父作用域中定义的函数 - 您可以使用＆amp;语法。

谢谢＆amp;干杯

Answer 2

问题是当您使用//input[@class='information' and @value='hello'] //input[@class='information' and @value='hi'] //input[@class='information' and @value='hey']进行隔离范围绑定时，它会将值从属性传递给指令。基本上在使用@传递值时@该值并在传递给指令之前。因此，指令的值不是stringify格式，它在到达指令之前被字符串化（数据类型更改为JSON）。

如果你string，你会看到结果（除了{{info}}之外）。它已被转换为字符串，这就是为什么你看不到ng-repear工作

首选方法是使用=，这将做两件事

双向绑定
当值传递给指令时，它保留数据类型的值。

带范围的Angular指令：@不工作

2 个答案: