Angular 1.2不再允许在同一个元素上使用多个隔离的范围指令?

时间:2021-03-18 12:14:00

I have some code in an Angular project that use two separate directives with isolated scope. They do not need to share scope, simply exist on the same element. They both alter the DOM in slightly different ways, and importantly bind to values passed as arguments.

我在Angular项目中有一些代码,它们使用两个具有隔离范围的独立指令。它们不需要共享范围,只需存在于同一元素上。它们都以稍微不同的方式改变DOM,并且重要的是绑定到作为参数传递的值。

This worked in 1.0, however Angular 1.2 now generates an error when attempting to do this

这在1.0中工作,但是Angular 1.2现在在尝试执行此操作时会生成错误

Multiple directives asking for new/isolated scope

要求新/隔离范围的多个指令

Based on the projects git history appears Angular 1.2 changes behaviour to keep two isolated directives on the same element separate. This is a good thing, and it works correctly when putting two 'Attribute' directives on the same element.

基于项目git历史出现Angular 1.2更改行为,以保持两个隔离的指令在同一元素上分开。这是一件好事,当在同一元素上放置两个“Attribute”指令时,它可以正常工作。

i.e.

<div my:directive="myDirectiveData" my:other-directive="myOtherDirectiveData" />

works as you would expect.

像你期望的那样工作。

however

<my:directive my:directive-data="myDirectiveData" my:other-directive="myOtherDirectiveData" />

Throws the above error. (Multiple directives asking for new/isolated scope)

引发上述错误。 (多个指令要求新/隔离范围)

In this scenario I would have expected each directive to still exist in parallel with their own unshared isolated scope.

在这种情况下,我希望每个指令仍然与它们自己的非共享隔离范围并行存在。

Is this still possible in Angular 1.2?

这在Angular 1.2中仍然可行吗?

2 个解决方案

#1


9  

Summary of what happens when multiple directives are defined on the same element:

在同一元素上定义多个指令时会发生什么情况的摘要:

  Scenario  directive #1   directive #2   Result
     1      no new scope   no new scope   Both directives use the controller's scope.
                                          (This should be obvious.)
     2      new scope      new scope      Both directives share one new child scope.
     3      new scope      no new scope   Both directives share one new child scope.
                                          Why does dir #2 use the child scope?
                                          This seems odd to me.
     4      isolate scope  no new scope   Angular v1.0: both directives share the
                                          isolate scope.
                                          Angular v1.2+: dir #1 uses the isolate scope,
                                          dir #2 uses the controller's scope.

Note that the following scenarios are not allowed (Angular throws an error):

请注意,不允许以下方案(Angular引发错误):

  Scenario  directive #1   directive #2
     5      isolate scope  new scope
     6      isolate scope  isolate scope

#2


1  

You can't have multiple directives asking for isolate scope on the same element. I think your problem may be caused by this unresolved issue in angularjs.

您不能在同一元素上有多个指令要求隔离范围。我认为您的问题可能是由angularjs中尚未解决的问题引起的。

#1


9  

Summary of what happens when multiple directives are defined on the same element:

在同一元素上定义多个指令时会发生什么情况的摘要:

  Scenario  directive #1   directive #2   Result
     1      no new scope   no new scope   Both directives use the controller's scope.
                                          (This should be obvious.)
     2      new scope      new scope      Both directives share one new child scope.
     3      new scope      no new scope   Both directives share one new child scope.
                                          Why does dir #2 use the child scope?
                                          This seems odd to me.
     4      isolate scope  no new scope   Angular v1.0: both directives share the
                                          isolate scope.
                                          Angular v1.2+: dir #1 uses the isolate scope,
                                          dir #2 uses the controller's scope.

Note that the following scenarios are not allowed (Angular throws an error):

请注意,不允许以下方案(Angular引发错误):

  Scenario  directive #1   directive #2
     5      isolate scope  new scope
     6      isolate scope  isolate scope

#2


1  

You can't have multiple directives asking for isolate scope on the same element. I think your problem may be caused by this unresolved issue in angularjs.

您不能在同一元素上有多个指令要求隔离范围。我认为您的问题可能是由angularjs中尚未解决的问题引起的。