diff --git a/modules/@angular/upgrade/src/upgrade_ng1_adapter.ts b/modules/@angular/upgrade/src/upgrade_ng1_adapter.ts index 0e1f19811a..648dbdeb39 100644 --- a/modules/@angular/upgrade/src/upgrade_ng1_adapter.ts +++ b/modules/@angular/upgrade/src/upgrade_ng1_adapter.ts @@ -133,9 +133,9 @@ export class UpgradeNg1ComponentAdapterBuilder { compileTemplate(compile: angular.ICompileService, templateCache: angular.ITemplateCacheService, httpBackend: angular.IHttpBackendService): Promise { if (this.directive.template !== undefined) { - this.linkFn = compileHtml(this.directive.template); + this.linkFn = compileHtml(typeof this.directive.template === 'function' ? this.directive.template() : this.directive.template); } else if (this.directive.templateUrl) { - var url = this.directive.templateUrl; + var url = typeof this.directive.templateUrl === 'function' ? this.directive.templateUrl() : this.directive.templateUrl; var html = templateCache.get(url); if (html !== undefined) { this.linkFn = compileHtml(html); diff --git a/modules/@angular/upgrade/test/upgrade_spec.ts b/modules/@angular/upgrade/test/upgrade_spec.ts index 6264190b50..7df9dcded4 100644 --- a/modules/@angular/upgrade/test/upgrade_spec.ts +++ b/modules/@angular/upgrade/test/upgrade_spec.ts @@ -430,6 +430,30 @@ export function main() { }); })); + it('should support templateUrl as a function', + inject([AsyncTestCompleter], (async) => { + var adapter = new UpgradeAdapter(); + var ng1Module = angular.module('ng1', []); + ng1Module.value('$httpBackend', + (method, url, post, cbFn) => { cbFn(200, `${method}:${url}`); }); + + var ng1 = function() { return {templateUrl(){ return 'url.html' }}; }; + ng1Module.directive('ng1', ng1); + var Ng2 = Component({ + selector: 'ng2', + template: '', + directives: [adapter.upgradeNg1Component('ng1')] + }).Class({constructor: function() {}}); + ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); + var element = html(`
`); + adapter.bootstrap(element, ['ng1']) + .ready((ref) => { + expect(multiTrim(document.body.textContent)).toEqual('GET:url.html'); + ref.dispose(); + async.done(); + }); + })); + it('should support empty template', inject([AsyncTestCompleter], (async) => { var adapter = new UpgradeAdapter(); var ng1Module = angular.module('ng1', []); @@ -451,6 +475,27 @@ export function main() { }); })); + it('should support template as a function', inject([AsyncTestCompleter], (async) => { + var adapter = new UpgradeAdapter(); + var ng1Module = angular.module('ng1', []); + + var ng1 = function() { return {template(){ return '' }}; }; + ng1Module.directive('ng1', ng1); + var Ng2 = Component({ + selector: 'ng2', + template: '', + directives: [adapter.upgradeNg1Component('ng1')] + }).Class({constructor: function() {}}); + ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); + var element = html(`
`); + adapter.bootstrap(element, ['ng1']) + .ready((ref) => { + expect(multiTrim(document.body.textContent)).toEqual(''); + ref.dispose(); + async.done(); + }); + })); + it('should support templateUrl fetched from $templateCache', inject([AsyncTestCompleter], (async) => { var adapter = new UpgradeAdapter();