diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts index cfed15fd20..09d702fc86 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts @@ -592,6 +592,54 @@ describe('compiler compliance: template', () => { expect(allTemplateFunctionsNames).toEqual(uniqueTemplateFunctionNames); }); + it('should create unique template function names for ng-content templates', () => { + const files = { + app: { + 'spec.ts': ` + import {Component, NgModule} from '@angular/core'; + + @Component({ + selector: 'a-component', + template: \` + + \`, + }) + export class AComponent { + show = true; + } + + @Component({ + selector: 'b-component', + template: \` + + \`, + }) + export class BComponent { + show = true; + } + + @NgModule({declarations: [AComponent, BComponent]}) + export class AModule {} + ` + }, + }; + + const result = compile(files, angularFiles); + + const allTemplateFunctionsNames = (result.source.match(/function ([^\s(]+)/g) || []) + .map(x => x.slice(9)) + .filter(x => x.includes('Template')) + .sort(); + const uniqueTemplateFunctionNames = Array.from(new Set(allTemplateFunctionsNames)); + + // Expected template function: + // - 1 for AComponent's template. + // - 1 for BComponent's template. + // - 2 for the two components. + expect(allTemplateFunctionsNames.length).toBe(1 + 1 + 2); + expect(allTemplateFunctionsNames).toEqual(uniqueTemplateFunctionNames); + }); + it('should create unique listener function names even for similar nested template structures', () => { const files = { diff --git a/packages/compiler/src/render3/view/template.ts b/packages/compiler/src/render3/view/template.ts index aa8a4a63f3..30b9f5f0db 100644 --- a/packages/compiler/src/render3/view/template.ts +++ b/packages/compiler/src/render3/view/template.ts @@ -822,7 +822,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver } const tagName = sanitizeIdentifier(template.tagName || ''); - const contextName = `${tagName ? this.contextName + '_' + tagName : ''}_${templateIndex}`; + const contextName = `${this.contextName}${tagName ? '_' + tagName : ''}_${templateIndex}`; const templateName = `${contextName}_Template`; const parameters: o.Expression[] = [