-
Notifications
You must be signed in to change notification settings - Fork 26.2k
fix(ivy): match attribute selectors for content projection with inline-templates #29041
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
1d9efaa
to
6f6ae43
Compare
053174d
to
7e23900
Compare
14ee11b
to
2d159ca
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Approach looks great, just minor comments
de06e79
to
bc63228
Compare
This commit adds a new `AttributeMarker` type that will be used, in a future commit, to mark attributes as coming from an inline-template expansion, rather than the element that is being contained in the template. PR Close #29041
…e-templates (#29041) The content projection mechanism is static, in that it only looks at the static template nodes before directives are matched and change detection is run. When you have a selector-based content projection the selection is based on nodes that are available in the template. For example: ``` <ng-content selector="[some-attr]"></ng-content> ``` would match ``` <div some-attr="..."></div> ``` If you have an inline-template in your projected nodes. For example: ``` <div *ngIf="..." some-attr="..."></div> ``` This gets pre-parsed and converted to a canonical form. For example: ``` <ng-template [ngIf]="..."> <div some-attr=".."></div> </ng-template> ``` Note that only structural attributes (e.g. `*ngIf`) stay with the `<ng-template>` node. The other attributes move to the contained element inside the template. When this happens in ivy, the ng-template content is removed from the component template function and is compiled into its own template function. But this means that the information about the attributes that were on the content are lost and the projection selection mechanism is unable to match the original `<div *ngIf="..." some-attr>`. This commit adds support for this in ivy. Attributes are separated into three groups (Bindings, Templates and "other"). For inline-templates the Bindings and "other" types are hoisted back from the contained node to the `template()` instruction, so that they can be used in content projection matching. PR Close #29041
For the template type checking to work correctly, it needs to know what attributes are bound to expressions or directives, which may require expressions in the template to be evaluated in a different scope. In inline templates, there are attributes that are now marked as "Template" attributes. We need to ensure that the template type checking code looks at these "bound" attributes as well as the "input" attributes. PR Close #29041
…orIndex` (angular#29041) The previous name was ambiguous as there are different strategies for matching selectors depending upon the scenario. PR Close angular#29041
…angular#29041) No idea where the tests for this code are, but it looks like this was an oversight in the original commit 6a0f78. PR Close angular#29041
…29041) This commit adds a new `AttributeMarker` type that will be used, in a future commit, to mark attributes as coming from an inline-template expansion, rather than the element that is being contained in the template. PR Close angular#29041
…e-templates (angular#29041) The content projection mechanism is static, in that it only looks at the static template nodes before directives are matched and change detection is run. When you have a selector-based content projection the selection is based on nodes that are available in the template. For example: ``` <ng-content selector="[some-attr]"></ng-content> ``` would match ``` <div some-attr="..."></div> ``` If you have an inline-template in your projected nodes. For example: ``` <div *ngIf="..." some-attr="..."></div> ``` This gets pre-parsed and converted to a canonical form. For example: ``` <ng-template [ngIf]="..."> <div some-attr=".."></div> </ng-template> ``` Note that only structural attributes (e.g. `*ngIf`) stay with the `<ng-template>` node. The other attributes move to the contained element inside the template. When this happens in ivy, the ng-template content is removed from the component template function and is compiled into its own template function. But this means that the information about the attributes that were on the content are lost and the projection selection mechanism is unable to match the original `<div *ngIf="..." some-attr>`. This commit adds support for this in ivy. Attributes are separated into three groups (Bindings, Templates and "other"). For inline-templates the Bindings and "other" types are hoisted back from the contained node to the `template()` instruction, so that they can be used in content projection matching. PR Close angular#29041
…lar#29041) For the template type checking to work correctly, it needs to know what attributes are bound to expressions or directives, which may require expressions in the template to be evaluated in a different scope. In inline templates, there are attributes that are now marked as "Template" attributes. We need to ensure that the template type checking code looks at these "bound" attributes as well as the "input" attributes. PR Close angular#29041
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
See FW-1002
Supercedes #28655