【问题标题】:Difference between defining isolated scope variable for angular directive in {} and in link在 {} 和链接中为角度指令定义隔离范围变量之间的区别
【发布时间】:2014-06-25 14:33:25
【问题描述】:

在角度指令中,我知道我可以分配隔离范围,但我需要添加 '=' 或 '@' 或 '&' 以在 {} 中定义变量,而我不必在链接中这样做,因为示例:

 scope: {
   foo:'=foo',
   bar:'@bar'
 }

这行得通

link: function($scope, $element){
  $scope.foo = 'foo';
  $scope.bar = 'bar';
}

这也有效(链接功能在指令中)

 scope: {
   foo:'foo',
   bar:'bar'
 }

这行不通!因为我没有添加 '=' 或 '@' 或 '&'

所以我的问题是,链接中的 $scope 应该与 $scope:{} 相同,两者都是相同的隔离范围,但是为什么我可以在链接中定义变量而不添加'='或'@'或' &'?

谢谢!!!

【问题讨论】:

    标签: javascript angularjs angularjs-directive angularjs-scope


    【解决方案1】:

    使用链接属性,您只是在处理指令的隔离范围。使用 scope 属性,您可以定义元素(在父范围内)的属性如何导入到您的隔离范围中。它们有不同的用途。

    =、@ 和 & 前缀定义了在将属性导入隔离范围时如何解释它们:

    1. modelParent: '=modelIsolate' - 通过在父作用域 (modelParent) 中定义的模型和隔离作用域 (modelIsolate) 中定义的模型之间建立双向模型绑定,将模型导入隔离作用域。在这里,指令上的 modelParent 属性被解释为一个模型。

    2. attrib1: '@attrib1' - 通过将属性值评估为字符串,将字符串导入隔离范围。该属性可能具有内插表达式。例如,如果您将“hello {{ name }}”作为属性传递给指令,其中 name 在父作用域中绑定到“James”,那么在隔离作用域中绑定到“attrib1”的将是 $scope。 attrib1 = '你好詹姆斯'。当“名称”绑定更改(即从 James 到 Mike)时,您隔离范围内的“attrib1”将自动更新。出于这个原因,@绑定有时被称为单向绑定。就个人而言,我喜欢将其视为支持插值的字符串。

    3. express: '&express' - 将表达式导入到您的隔离范围中,该范围可以在父范围中进行评估。这通常用于从指令的隔离范围内执行存在于父范围内的函数。例如,如果您在父作用域中定义了一个单击处理程序:$scope.onclick = function() {};,并将其传递到您的指令:<directive attrib1="onclick" />,您可以从指令中调用该函数:模板:'<div ng-click="attrib1()" />'

    所有三种方法都将作用域变量从父作用域导入到您的隔离作用域中。但是根据您希望如何解释指令属性,您会更喜欢其中一个。

    【讨论】:

    • 是的,我知道 '= @ &' 的用法,但我的问题是角度迫使我在 $scope = {} 中添加 '= @ &',但为什么我不必在链接函数的变量定义中添加这些前缀?
    • 感谢您的回答! :)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-11-01
    • 1970-01-01
    相关资源
    最近更新 更多