fix(ivy): properly insert views into ViewContainerRef injected by querying <ng-container> (#33816)
When asking for a ViewContainerRef on <ng-container> we do reuse <ng-container> comment node as a LContainer's anachor. Before this fix the act of re-using a <ng-container>'s comment node would result in this comment node being re-appended to the DOM in the wrong place. With the fix in this PR we make sure that re-using <ng-container>'s comment node doesn't result in unwanted DOM manipulation (ng-gontainer's comment node is already part of the DOM and doesn't have to be re-created / re-appended). PR Close #33816
This commit is contained in:

committed by
Alex Rickabaugh

parent
5be23a309e
commit
f136ddad0d
@ -541,4 +541,42 @@ describe('view insertion', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('non-regression', () => {
|
||||
|
||||
// https://github.com/angular/angular/issues/33679
|
||||
it('should insert views into ViewContainerRef injected by querying <ng-container>', () => {
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
template: `
|
||||
<div>container start|</div>
|
||||
<ng-container #container></ng-container>
|
||||
<div>|container end</div>
|
||||
|
||||
<ng-template #template >test</ng-template>
|
||||
<div (click)="click()" >|click</div>
|
||||
`
|
||||
})
|
||||
class AppComponent {
|
||||
@ViewChild('container', {read: ViewContainerRef, static: true})
|
||||
vcr !: ViewContainerRef;
|
||||
|
||||
@ViewChild('template', {read: TemplateRef, static: true}) template !: TemplateRef<any>;
|
||||
|
||||
click() { this.vcr.createEmbeddedView(this.template, undefined, 0); }
|
||||
}
|
||||
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [AppComponent],
|
||||
});
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
fixture.detectChanges();
|
||||
expect(fixture.nativeElement.textContent).toBe('container start||container end|click');
|
||||
|
||||
fixture.componentInstance.click();
|
||||
fixture.detectChanges();
|
||||
expect(fixture.nativeElement.textContent).toBe('container start|test|container end|click');
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
Reference in New Issue
Block a user