当前位置: 首页 > 面试题库 >

AngularJS指令范围中的'@'和'='有什么区别?

吕飞翼
2023-03-14
问题内容

我已经仔细阅读了有关该主题的 AngularJS
文档,然后摆弄了一条指令。这是jsfiddle。

以下是一些相关的摘要:

  • HTML

    <pane bi-title="title" title="{{title}}">{{text}}</pane>
    
  • 从窗格指令:

    scope: { biTitle: '=', title: '@', bar: '=' },
    

我没有几件事:

  • 为什么必须"{{title}}"'@'"title"一起使用'='
  • 我是否还可以直接访问父范围,而不用属性装饰元素?
  • 该文档说: “通常希望通过表达式将数据从隔离的范围传递到父范围” ,但这似乎也可以与双向绑定一起使用。为什么表达途径会更好?

我发现了另一个小提琴,它也显示了表达式解决方案:http :
//jsfiddle.net/maxisam/QrCXh/


问题答案:

为什么我必须在“ @ ”中使用“ {{title}}”,而在“ = ”中使用“ title” ?

@ 将本地/定向范围属性绑定到 DOM属性评估值
。如果使用title=title1title="title1",则DOM属性“
title”的值就是字符串title1。如果使用title="{{title}}",则DOM属性“
title”的值是的内插值{{title}},因此该字符串将是当前设置为父范围属性“ title”的任何值。由于属性值始终是字符串,因此在使用
@ 时,在指令范围内,此属性总是以字符串值结尾。

= 将本地/定向范围属性绑定到 父范围属性 。因此,使用 =
,您可以将父模型/范围属性名称用作DOM属性的值。您不能将{{}}s与 = 一起使用。

使用@,您可以执行title="{{title}} and then some"-插入{{title}}的操作,然后将字符串“ and some
some”与其连接在一起。最终的串联字符串是local / directive范围属性所获得的。(您不能使用 = ,只能使用 @ 。)

随着 @ ,你将需要使用attr.$observe('title', function(value) { ... }),如果您需要在您的链接(荷兰国际集团)函数使用的值。例如,if(scope.title == "...")不会像您期望的那样工作。请注意,这意味着您只能
异步
访问此属性。如果仅在模板中使用值,则无需使用$ observe()。例如template: '<div>{{title}}</div>'

使用 = ,您不需要使用$ observe。

我是否还可以直接访问父范围,而不用属性装饰元素?

是的,但前提是您不使用隔离范围。从指令中删除此行

scope: { ... }

然后您的指令将不会创建新的作用域。它将使用父范围。然后,您可以直接访问所有父范围属性。

该文档说:“通常希望通过表达式将数据从隔离的范围传递到父范围”,但这似乎也可以与双向绑定一起使用。为什么表达途径会更好?

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



 类似资料:
  • 我仔细阅读了关于这个主题的AngularJS文档,然后随意修改了一个指令。小提琴在这里。 下面是一些相关的片段: > 来自HTML: 在窗格指令中: 有几件事我不明白: 为什么必须使用与和与? 是否也可以直接访问父范围,而不使用属性装饰元素? 文档说“通常希望通过表达式将数据从独立作用域传递到父作用域”,但这似乎也适用于双向绑定。为什么表达式路由会更好? 我找到了另一个显示表达式解的fiddle:

  • 问题内容: AngularJS指令的默认作用域值是什么? 当然,它不是孤立的范围。这是对还是错。 我找不到有关它的任何文档。 问题答案: “请注意,默认情况下,伪指令不会创建新的作用域-即,默认值为” 从理解范围。 使用指令中的scope选项,您可以: 创建一个原型继承的子范围 创建一个独立的作用域,然后您可以将某些属性绑定到父作用域。 决定不创建新的作用域,并使用父级(默认)。

  • 那么,的目的是什么?不能访问通过传递的所有属性。为什么一个max的访问值不能作为而不是 为什么要像那样分配回来? 谢了。

  • 两者都返回一个列表,那么到底有什么区别呢?

  • 问题内容: 请在这里查看示例 角需要,,以在所述分离的范围对象从父范围访问它来限定。 在这里使用 那么,目的是什么?无法访问通过传递的所有属性。为什么不能将max的一个访问值代替 为什么要分配回来像? 由于此应用程序是由Angular作者编写的,因此我希望有一个理由。 谢谢。 问题答案: attrs的目的是什么? 在与指令相同的元素上定义的属性有几个用途: 它们是将信息传递到使用隔离范围的指令的唯

  • 在聚合物入门页面上,我们看到了一个使用聚合物的示例: 您将注意到是由和定义的。