honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(ivy): properly handle re-projection with an empty set of nodes to re-project (#31306) 

PR Close #31306
This commit is contained in:
Pawel Kozlowski 2019-06-27 12:11:05 +02:00 committed by Alex Rickabaugh
parent c12b6fa028
commit 7ca611cd12
2 changed files with 50 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/core/src/render3/node_manipulation.ts
View File

@ -780,6 +780,7 @@ function executeActionOnView(
* @param renderer Renderer to use
* @param action action to perform (insert, detach, destroy)
* @param lView The LView which needs to be inserted, detached, destroyed.
* @param tProjectionNode projection TNode to process
* @param renderParent parent DOM element for insertion/removal.
* @param beforeNode Before which node the insertions should happen.
*/
@ -789,20 +790,25 @@ function executeActionOnProjection(
beforeNode: RNode | null | undefined) {
const componentLView = findComponentView(lView);
const componentNode = componentLView[T_HOST] as TElementNode;
const nodeToProject = componentNode.projection ![tProjectionNode.projection] !;
if (Array.isArray(nodeToProject)) {
for (let i = 0; i < nodeToProject.length; i++) {
const rNode = nodeToProject[i];
ngDevMode && assertDomNode(rNode);
executeActionOnElementOrContainer(action, renderer, renderParent, rNode, beforeNode);
}
} else {
let projectionTNode: TNode|null = nodeToProject;
const projectedComponentLView = componentLView[PARENT] as LView;
while (projectionTNode !== null) {
executeActionOnNode(
renderer, action, projectedComponentLView, projectionTNode, renderParent, beforeNode);
projectionTNode = projectionTNode.projectionNext;
ngDevMode && assertDefined(
componentNode.projection,
'Element nodes for which projection is processed must have projection defined.');
const nodeToProject = componentNode.projection ![tProjectionNode.projection];
if (nodeToProject !== undefined) {
if (Array.isArray(nodeToProject)) {
for (let i = 0; i < nodeToProject.length; i++) {
const rNode = nodeToProject[i];
ngDevMode && assertDomNode(rNode);
executeActionOnElementOrContainer(action, renderer, renderParent, rNode, beforeNode);
}
} else {
let projectionTNode: TNode|null = nodeToProject;
const projectedComponentLView = componentLView[PARENT] as LView;
while (projectionTNode !== null) {
executeActionOnNode(
renderer, action, projectedComponentLView, projectionTNode, renderParent, beforeNode);
projectionTNode = projectionTNode.projectionNext;
}
}
}
}
@ -870,13 +876,12 @@ function executeActionOnElementContainerOrIcuContainer(
function executeActionOnNode(
renderer: Renderer3, action: WalkTNodeTreeAction, lView: LView, tNode: TNode,
renderParent: RElement | null, beforeNode: RNode | null | undefined): void {
const elementContainerRootTNodeType = tNode.type;
if (elementContainerRootTNodeType === TNodeType.ElementContainer ||
elementContainerRootTNodeType === TNodeType.IcuContainer) {
const nodeType = tNode.type;
if (nodeType === TNodeType.ElementContainer || nodeType === TNodeType.IcuContainer) {
executeActionOnElementContainerOrIcuContainer(
renderer, action, lView, tNode as TElementContainerNode | TIcuContainerNode, renderParent,
beforeNode);
} else if (elementContainerRootTNodeType === TNodeType.Projection) {
} else if (nodeType === TNodeType.Projection) {
executeActionOnProjection(
renderer, action, lView, tNode as TProjectionNode, renderParent, beforeNode);
} else {

27
packages/core/test/acceptance/view_container_ref_spec.ts
View File

@ -1551,6 +1551,33 @@ describe('ViewContainerRef', () => {
'<child-with-view>Before (inside)- Before projected <header vcref="">blah</header><span>bar</span> After projected -After (inside)</child-with-view>');
});
it('should handle empty re-projection into the root of a view', () => {
@Component({
selector: 'root-comp',
template: `<ng-template [ngIf]="show"><ng-content></ng-content></ng-template>`,
})
class RootComp {
@Input() show: boolean = true;
}
@Component({
selector: 'my-app',
template: `<root-comp [show]="show"><ng-content></ng-content><div></div></root-comp>`
})
class MyApp {
show = true;
}
TestBed.configureTestingModule({declarations: [MyApp, RootComp]});
const fixture = TestBed.createComponent(MyApp);
fixture.detectChanges();
expect(fixture.nativeElement.querySelectorAll('div').length).toBe(1);
fixture.componentInstance.show = false;
fixture.detectChanges();
expect(fixture.nativeElement.querySelectorAll('div').length).toBe(0);
});
describe('with select', () => {
@Component({