terminal: true 和 priority > 100 导致“@”参数停止工作

Question

下面的代码 "breaks" 内插作用域值 p1: "@"。我做错了什么还是 Angular 错误？

.directive("foo", function($compile){
  return {
    terminal: true,
    priority: 200, // anything > 100
    templateUrl: "foo.html",
    scope: {
      p1: "@", // doesn't work
      p2: "=", // works
      p3: "&"  // works
    },
    link: function(scope, element){
      // this also doesn't help
      $compile(element.contents())(scope);
    }
  };
});

模板 foo.html 是：

<div>{{p1}}</div>
<div>{{p2}}</div>

<foo p1="{{name}}" p2="name" ng-init="name = 'something'"></foo> 的输出是：

{{name}}
something

plunker

Answer 1

问题在于您在指令中设置的优先级。

通常，只有在一个元素上有多个指令时，优先级才有意义。优先级决定了这些指令的顺序 applied/started。在大多数情况下您不需要优先级，但有时当您使用编译函数时，您希望确保您的编译函数先运行。

现在你的问题是你设置了你的优先级指令为 200。{{}} 插值的优先级是 100.

因此，在您的情况下，即使在对值进行插值之前，指令也会编译，因此您的 p1 属性的值为 {{something}}。

Keep the priority of your directive anything less than 100 and things will work out as expected.

terminal: true 和 priority > 100 导致“@”参数停止工作

terminal: true and priority > 100 causes "@" parameter to stop working

angularjs

angularjs-directive