diff --git a/packages/core/src/render3/util/misc_utils.ts b/packages/core/src/render3/util/misc_utils.ts index cf45c6f6c4..50db0983e2 100644 --- a/packages/core/src/render3/util/misc_utils.ts +++ b/packages/core/src/render3/util/misc_utils.ts @@ -26,7 +26,6 @@ export function isDifferent(a: any, b: any): boolean { * be extra careful not to introduce megamorphic reads in it. */ export function renderStringify(value: any): string { - if (typeof value === 'function') return value.name || value; if (typeof value === 'string') return value; if (value == null) return ''; return '' + value; @@ -38,9 +37,10 @@ export function renderStringify(value: any): string { * Important! This function contains a megamorphic read and should only be * used for error messages. */ -export function stringifyForError(value: any) { +export function stringifyForError(value: any): string { + if (typeof value === 'function') return value.name || value.toString(); if (typeof value === 'object' && value != null && typeof value.type === 'function') { - return value.type.name || value.type; + return value.type.name || value.type.toString(); } return renderStringify(value); diff --git a/packages/core/test/acceptance/text_spec.ts b/packages/core/test/acceptance/text_spec.ts index 3f3e665f06..87f6d28664 100644 --- a/packages/core/test/acceptance/text_spec.ts +++ b/packages/core/test/acceptance/text_spec.ts @@ -112,4 +112,20 @@ describe('text instructions', () => { expect(div.innerHTML).toBe('<h1>LOL, big text</h1>'); }); + + it('should stringify functions used in bindings', () => { + @Component({ + template: '
{{test}}
', + }) + class App { + test = function foo() {}; + } + + TestBed.configureTestingModule({declarations: [App]}); + const fixture = TestBed.createComponent(App); + fixture.detectChanges(); + const div = fixture.nativeElement.querySelector('div'); + + expect(div.innerHTML).toBe('function foo() { }'); + }); });