fix(ivy): don't match directives against attribute bindings (#31541)

Fixes Ivy matching directives against attribute bindings (e.g. `[attr.some-directive]="foo"`). Works by excluding attribute bindings from the attributes array during compilation. This has the added benefit of generating less code.

**Note:** My initial approach to implementing this was to have a different marker for attribute bindings so that they can be ignored when matching directives, however as I was implementing it I realized that the attributes in that array were only used for directive matching (as far as I could tell). I decided to drop the attribute bindings completely, because it results in less generated code.

PR Close #31541
This commit is contained in:
crisbeto
2019-07-13 13:34:34 +02:00
committed by Matias Niemelä
parent 9e83822679
commit 12fd06916b
6 changed files with 70 additions and 9 deletions

View File

@ -1253,11 +1253,13 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
}
if (inputs.length || outputs.length) {
const attrsStartIndex = attrExprs.length;
const attrsLengthBeforeInputs = attrExprs.length;
for (let i = 0; i < inputs.length; i++) {
const input = inputs[i];
if (input.type !== BindingType.Animation) {
// We don't want the animation and attribute bindings in the
// attributes array since they aren't used for directive matching.
if (input.type !== BindingType.Animation && input.type !== BindingType.Attribute) {
addAttrExpr(input.name);
}
}
@ -1273,8 +1275,8 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
// values have been filtered (by not including the animation ones) and added
// to the expressions. The marker is important because it tells the runtime
// code that this is where attributes without values start...
if (attrExprs.length) {
attrExprs.splice(attrsStartIndex, 0, o.literal(core.AttributeMarker.Bindings));
if (attrExprs.length !== attrsLengthBeforeInputs) {
attrExprs.splice(attrsLengthBeforeInputs, 0, o.literal(core.AttributeMarker.Bindings));
}
}