feat(upgrade): support $element in upgraded component template/templateUrl functions (#31637)

PR Close #31637
This commit is contained in:
Ben Black 2019-07-18 16:48:28 -04:00 committed by Miško Hevery
parent 87ce4e997b
commit 29e1c53a31
2 changed files with 12 additions and 11 deletions

View File

@ -71,13 +71,13 @@ export class UpgradeHelper {
}
static getTemplate(
$injector: IInjectorService, directive: IDirective, fetchRemoteTemplate = false): string
|Promise<string> {
$injector: IInjectorService, directive: IDirective, fetchRemoteTemplate = false,
$element?: IAugmentedJQuery): string|Promise<string> {
if (directive.template !== undefined) {
return getOrCall<string>(directive.template);
return getOrCall<string>(directive.template, $element);
} else if (directive.templateUrl) {
const $templateCache = $injector.get($TEMPLATE_CACHE) as ITemplateCacheService;
const url = getOrCall<string>(directive.templateUrl);
const url = getOrCall<string>(directive.templateUrl, $element);
const template = $templateCache.get(url);
if (template !== undefined) {
@ -114,7 +114,8 @@ export class UpgradeHelper {
compileTemplate(template?: string): ILinkFn {
if (template === undefined) {
template = UpgradeHelper.getTemplate(this.$injector, this.directive) as string;
template =
UpgradeHelper.getTemplate(this.$injector, this.directive, false, this.$element) as string;
}
return this.compileHtml(template);
@ -304,8 +305,8 @@ export class UpgradeHelper {
}
}
function getOrCall<T>(property: T | Function): T {
return isFunction(property) ? property() : property;
function getOrCall<T>(property: T | Function, ...args: any[]): T {
return isFunction(property) ? property(...args) : property;
}
// NOTE: Only works for `typeof T !== 'object'`.

View File

@ -106,12 +106,12 @@ withEachNg1Version(() => {
});
}));
it('should support not pass any arguments to `template` function', async(() => {
it('should pass $element to `template` function and not $attrs', async(() => {
// Define `ng1Component`
const ng1Component: angular.IComponent = {
template: ($attrs: angular.IAttributes, $element: angular.IAugmentedJQuery) => {
expect($attrs).toBeUndefined();
expect($element).toBeUndefined();
expect($element).toBeDefined();
return 'Hello, Angular!';
}
@ -241,12 +241,12 @@ withEachNg1Version(() => {
});
}));
it('should support not pass any arguments to `templateUrl` function', async(() => {
it('should pass $element to `templateUrl` function and not $attrs', async(() => {
// Define `ng1Component`
const ng1Component: angular.IComponent = {
templateUrl: ($attrs: angular.IAttributes, $element: angular.IAugmentedJQuery) => {
expect($attrs).toBeUndefined();
expect($element).toBeUndefined();
expect($element).toBeDefined();
return 'ng1.component.html';
}