Skip to content

Commit

Permalink
refactor(compiler): Add a new test for bindings on ng-template elem…
Browse files Browse the repository at this point in the history
…ents.

Consider the following very strange template:

```
<ng-template l="l1" [p]="p1" [attr.a]="a1" [class.c]="c1"></ng-template>
```

It's not clear what a class binding on an `ng-template` would actually do. Nonetheless, it's well-defined behavior in TemplateDefinitionBuilder, which emits `property` instructions for all three bindings, and people rely actually do this in google3.

The test isn't passing yet, so check it in disabled for template pipeline.
  • Loading branch information
dylhunn committed Dec 9, 2023
1 parent ecfb544 commit f4e4388
Show file tree
Hide file tree
Showing 3 changed files with 36 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -390,6 +390,18 @@
}
],
"skipForTemplatePipeline": true
},
{
"description": "should handle a very complicated case with many bindings on plain and structural templates",
"inputFiles": [
"ng_template_bindings.ts"
],
"expectations": [
{
"failureMessage": "Incorrect template"
}
],
"skipForTemplatePipeline": true
}
]
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
function MyComponent_ng_template_0_Template(rf, ctx) { }


consts: [["l", "l1", __AttributeMarker.Bindings__, "p", "c"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
i0.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 0, 0, "ng-template", 0);
} if (rf & 2) {
i0.ɵɵproperty("p", ctx.p1)("a", ctx.a1)("c", ctx.c1);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import {Component} from '@angular/core';

@Component({
selector: 'my-component',
standalone: true,
template: '<ng-template l="l1" [p]="p1" [attr.a]="a1" [class.c]="c1"></ng-template>',
})
export class MyComponent {
p1!: any;
a1!: any;
c1!: any;
}

0 comments on commit f4e4388

Please sign in to comment.