diff --git a/packages/core/src/render3/node_manipulation.ts b/packages/core/src/render3/node_manipulation.ts index 22f76a7abd..8a901ffb98 100644 --- a/packages/core/src/render3/node_manipulation.ts +++ b/packages/core/src/render3/node_manipulation.ts @@ -682,7 +682,6 @@ function getFirstNativeNode(lView: LView, tNode: TNode | null): RNode|null { TNodeType.IcuContainer, TNodeType.Projection); const tNodeType = tNode.type; - if (tNodeType === TNodeType.Element) { return getNativeByTNode(tNode, lView); } else if (tNodeType === TNodeType.Container) { @@ -692,7 +691,12 @@ function getFirstNativeNode(lView: LView, tNode: TNode | null): RNode|null { if (elIcuContainerChild !== null) { return getFirstNativeNode(lView, elIcuContainerChild); } else { - return getNativeByTNode(tNode, lView); + const rNodeOrLContainer = lView[tNode.index]; + if (isLContainer(rNodeOrLContainer)) { + return getBeforeNodeForView(-1, rNodeOrLContainer); + } else { + return unwrapRNode(rNodeOrLContainer); + } } } else { const componentView = lView[DECLARATION_COMPONENT_VIEW]; diff --git a/packages/core/test/acceptance/view_insertion_spec.ts b/packages/core/test/acceptance/view_insertion_spec.ts index 06f8c6fcbd..9e846e25dd 100644 --- a/packages/core/test/acceptance/view_insertion_spec.ts +++ b/packages/core/test/acceptance/view_insertion_spec.ts @@ -578,5 +578,37 @@ describe('view insertion', () => { expect(fixture.nativeElement.textContent).toBe('container start|test|container end|click'); }); + it('should properly insert before views in a ViewContainerRef injected on ng-container', () => { + @Component({ + selector: 'app-root', + template: ` + + {{parameter}} + + + + ` + }) + class AppComponent { + items = [1]; + } + + TestBed.configureTestingModule({ + declarations: [AppComponent], + imports: [CommonModule], + }); + + const fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + expect(fixture.nativeElement.textContent.trim()).toContain('1'); + + fixture.componentInstance.items = [2, 1]; + fixture.detectChanges(); + + expect(fixture.nativeElement.textContent.trim()).toContain('2 1'); + }); + }); });