cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ivy): provide an ability to match <ng-template> tags (#27636)

Browse Source 
Prior to this change, we were unable to match directives using `ng-template` tags (for example the following selector would not work even though there might be some <ng-template>s in a template: `ng-template[directiveA]`. As a result, that broke some components that relies on such selectors to work. In order to resolve the problem, we now pass tag name to the `template` instruction (where we passed `null` before) and this tag name is used for matching at runtime. This update should also help support projecting containers, because the tag name is required to properly match such elements.

PR Close #27636
This commit is contained in:
Andrew Kushnir
2018-12-12 15:23:12 -08:00
committed by Miško Hevery
parent ea10a3abe5
commit dfbf6d72b0
29 changed files with 488 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts
View File

@ -11,9 +11,10 @@ import {setup} from '@angular/compiler/test/aot/test_util';
import {compile, expectEmit} from './mock_compile';
/* These tests are codified version of the tests in compiler_canonical_spec.ts. Every
* test in compiler_canonical_spec.ts should have a corresponding test here.
*/
/**
* These tests are codified version of the tests in compiler_canonical_spec.ts. Every
* test in compiler_canonical_spec.ts should have a corresponding test here.
*/
describe('compiler compliance', () => {
const angularFiles = setup({
@ -794,7 +795,7 @@ describe('compiler compliance', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "ul", null, $c1$);
$r3$.ɵtemplate(2, MyComponent_li_Template_2, 2, 2, null, $c2$);
$r3$.ɵtemplate(2, MyComponent_li_Template_2, 2, 2, "li", $c2$);
$r3$.ɵelementEnd();
}
},
@ -1218,7 +1219,7 @@ describe('compiler compliance', () => {
$r3$.ɵelementEnd();
}
}
function Template_2(rf, ctx) {
function Cmp_ng_template_Template_2(rf, ctx) {
if (rf & 1) {
$r3$.ɵprojectionDef();
$r3$.ɵtext(0, " '*' selector: ");
@ -1228,9 +1229,9 @@ describe('compiler compliance', () => {
…
template: function Cmp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, Cmp_div_Template_0, 2, 0, null, $_c0$);
$r3$.ɵtemplate(1, Cmp_div_Template_1, 2, 0, null, $_c0$);
$r3$.ɵtemplate(2, Template_2, 2, 0);
$r3$.ɵtemplate(0, Cmp_div_Template_0, 2, 0, "div", $_c0$);
$r3$.ɵtemplate(1, Cmp_div_Template_1, 2, 0, "div", $_c0$);
$r3$.ɵtemplate(2, Cmp_ng_template_Template_2, 2, 0, "ng-template");
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ngIf", $r3$.ɵbind(ctx.visible));
@ -1867,7 +1868,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵtext(1);
$r3$.ɵtemplate(2, MyComponent_div_span_Template_2, 2, 3, null, $c2$);
$r3$.ɵtemplate(2, MyComponent_div_span_Template_2, 2, 3, "span", $c2$);
$r3$.ɵelement(3, "span", null, $c4$);
$r3$.ɵelementEnd();
}
@ -1889,7 +1890,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$r3$.ɵelement(0, "div", null, $c1$);
$r3$.ɵtext(2);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 5, 2, null, $c2$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 5, 2, "div", $c2$);
$r3$.ɵelement(4, "div", null, $c3$);
}
if (rf & 2) {
@ -1954,7 +1955,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$i0$.ɵelementStart(0, "div");
$i0$.ɵelement(1, "div", null, $c1$);
$i0$.ɵtemplate(3, MyComponent_div_span_Template_3, 2, 2, null, $c2$);
$i0$.ɵtemplate(3, MyComponent_div_span_Template_3, 2, 2, "span", $c2$);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -1966,7 +1967,7 @@ describe('compiler compliance', () => {
// ...
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 4, 1, null, $c0$);
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 4, 1, "div", $c0$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items));
@ -2119,6 +2120,9 @@ describe('compiler compliance', () => {
}
};
// TODO(akushnir): tag name generated for <g> element inside <svg> is incorrect.
// It's generated as ":svg:g", when it should be just "g". Potentially related to
// the issue described in FW-672.
it('should support embedded views in the SVG namespace', () => {
const files = {
app: {
@ -2177,7 +2181,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$r3$.ɵnamespaceSVG();
$r3$.ɵelementStart(0,"svg");
$r3$.ɵtemplate(1, MyComponent__svg_g_Template_1, 2, 0, null, $t1_attrs$);
$r3$.ɵtemplate(1, MyComponent__svg_g_Template_1, 2, 0, ":svg:g", $t1_attrs$);
$r3$.ɵelementEnd();
}
if (rf & 2) { $r3$.ɵelementProperty(1,"forOf",$r3$.ɵbind(ctx.items)); }
@ -2255,7 +2259,7 @@ describe('compiler compliance', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "ul");
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 2, 1, null, $t1_attrs$);
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 2, 1, "li", $t1_attrs$);
$r3$.ɵelementEnd();
}
if (rf & 2) {
@ -2334,7 +2338,7 @@ describe('compiler compliance', () => {
$r3$.ɵtext(2);
$r3$.ɵelementEnd();
$r3$.ɵelementStart(3, "ul");
$r3$.ɵtemplate(4, MyComponent_li_li_Template_4, 2, 2, null, $t4_attrs$);
$r3$.ɵtemplate(4, MyComponent_li_li_Template_4, 2, 2, "li", $t4_attrs$);
$r3$.ɵelementEnd();
$r3$.ɵelementEnd();
}
@ -2355,7 +2359,7 @@ describe('compiler compliance', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "ul");
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 5, 2, null, $c1$);
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 5, 2, "li", $c1$);
$r3$.ɵelementEnd();
}
if (rf & 2) {

120
packages/compiler-cli/test/compliance/r3_view_compiler_directives_spec.ts
View File

@ -23,7 +23,7 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Input, NgModule} from '@angular/core';
import {Component, Directive, NgModule} from '@angular/core';
@Directive({selector: '[i18n]'})
export class I18nDirective {}
@ -63,7 +63,7 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Input, NgModule} from '@angular/core';
import {Component, Directive, NgModule} from '@angular/core';
@Directive({selector: '[i18n]'})
export class I18nDirective {}
@ -154,6 +154,118 @@ describe('compiler compliance: directives', () => {
expectEmit(source, MyComponentDefinition, 'Incorrect ChildComponent.ngComponentDef');
});
it('should match directives on ng-templates', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, NgModule, TemplateRef} from '@angular/core';
@Directive({
selector: 'ng-template[directiveA]'
})
export class DirectiveA {
constructor(public templateRef: TemplateRef<any>) {}
}
@Component({
selector: 'my-component',
template: \`
<ng-template directiveA>Some content</ng-template>
\`
})
export class MyComponent {}
@NgModule({declarations: [DirectiveA, MyComponent]})
export class MyModule{}
`
}
};
const MyComponentDefinition = `
…
const $_c0$ = ["directiveA", ""];
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$r3$.ɵtext(0, "Some content");
}
}
…
MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_ng_template_Template_0, 1, 0, "ng-template", $_c0$);
}
},
…
directives: [DirectiveA],
…
});
`;
const result = compile(files, angularFiles);
expectEmit(result.source, MyComponentDefinition, 'Incorrect ChildComponent.ngComponentDef');
});
it('should match directives on ng-container', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, NgModule, TemplateRef} from '@angular/core';
@Directive({
selector: 'ng-container[directiveA]'
})
export class DirectiveA {
constructor(public templateRef: TemplateRef<any>) {}
}
@Component({
selector: 'my-component',
template: \`
<ng-container *ngIf="showing" directiveA>Some content</ng-container>
\`
})
export class MyComponent {}
@NgModule({declarations: [DirectiveA, MyComponent]})
export class MyModule{}
`
}
};
const MyComponentDefinition = `
…
const $_c0$ = [1, "ngIf"];
const $_c1$ = ["directiveA", ""];
function MyComponent_ng_container_Template_0(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementContainerStart(0, $_c1$);
$r3$.ɵtext(1, "Some content");
$r3$.ɵelementContainerEnd();
}
}
…
MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_ng_container_Template_0, 2, 0, "ng-container", $_c0$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ngIf", $r3$.ɵbind(ctx.showing));
}
},
…
directives: [DirectiveA],
…
});
`;
const result = compile(files, angularFiles);
expectEmit(result.source, MyComponentDefinition, 'Incorrect ChildComponent.ngComponentDef');
});
it('should match directives on ng-template bindings', () => {
const files = {
@ -185,7 +297,7 @@ describe('compiler compliance: directives', () => {
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, Template_0, 0, 0, null, $c0_a0$);
$r3$.ɵtemplate(0, MyComponent_ng_template_Template_0, 0, 0, "ng-template", $c0_a0$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "someDirective", $r3$.ɵbind(true));
@ -233,7 +345,7 @@ describe('compiler compliance: directives', () => {
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 1, 0, null, $c0_a0$);
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 1, 0, "div", $c0_a0$);
}
},
…

64
packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts
View File

@ -422,7 +422,7 @@ describe('i18n support in the view compiler', () => {
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 4, 3, null, $_c0$);
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 4, 3, "div", $_c0$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ngForOf", $r3$.ɵbind(ctx.items));
@ -551,7 +551,7 @@ describe('i18n support in the view compiler', () => {
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 4, 3, null, $_c0$);
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 4, 3, "div", $_c0$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ngForOf", $r3$.ɵbind(ctx.items));
@ -955,7 +955,7 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵtext(1, " Some content ");
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 5, 4, null, $_c0$);
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 5, 4, "div", $_c0$);
$r3$.ɵelementEnd();
}
if (rf & 2) {
@ -1004,8 +1004,8 @@ describe('i18n support in the view compiler', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "img", $_c0$);
$r3$.ɵtemplate(1, MyComponent_img_Template_1, 1, 0, null, $_c1$);
$r3$.ɵtemplate(2, MyComponent_img_Template_2, 2, 1, null, $_c1$);
$r3$.ɵtemplate(1, MyComponent_img_Template_1, 1, 0, "img", $_c1$);
$r3$.ɵtemplate(2, MyComponent_img_Template_2, 2, 1, "img", $_c1$);
}
if (rf & 2) {
$r3$.ɵelementProperty(1, "ngIf", $r3$.ɵbind(ctx.visible));
@ -1065,7 +1065,7 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵelementStart(1, "div");
$r3$.ɵelementStart(2, "div");
$r3$.ɵpipe(3, "uppercase");
$r3$.ɵtemplate(4, MyComponent_div_div_Template_4, 3, 2, null, $_c1$);
$r3$.ɵtemplate(4, MyComponent_div_div_Template_4, 3, 2, "div", $_c1$);
$r3$.ɵelementEnd();
$r3$.ɵelementEnd();
$r3$.ɵi18nEnd();
@ -1115,8 +1115,8 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $I18N_EXTERNAL_1221890473527419724$$APP_SPEC_TS_0$);
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 5, 5, null, $_c1$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 4, 4, null, $_c1$);
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 5, 5, "div", $_c1$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 4, 4, "div", $_c1$);
$r3$.ɵi18nEnd();
$r3$.ɵelementEnd();
}
@ -1162,7 +1162,7 @@ describe('i18n support in the view compiler', () => {
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 3, 1, null, $_c0$);
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 3, 1, "div", $_c0$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ngIf", $r3$.ɵbind(ctx.visible));
@ -1233,7 +1233,7 @@ describe('i18n support in the view compiler', () => {
const output = String.raw `
const $MSG_EXTERNAL_2413150872298537152$$APP_SPEC_TS_0$ = goog.getMsg("My i18n block #2");
const $MSG_EXTERNAL_4890179241114413722$$APP_SPEC_TS__1$ = goog.getMsg("My i18n block #1");
function Template_0(rf, ctx) {
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $MSG_EXTERNAL_4890179241114413722$$APP_SPEC_TS__1$);
}
@ -1241,7 +1241,7 @@ describe('i18n support in the view compiler', () => {
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, Template_0, 1, 0);
$r3$.ɵtemplate(0, MyComponent_ng_template_Template_0, 1, 0, "ng-template");
$r3$.ɵelementContainerStart(1);
$r3$.ɵi18n(2, $MSG_EXTERNAL_2413150872298537152$$APP_SPEC_TS_0$);
$r3$.ɵelementContainerEnd();
@ -1325,7 +1325,7 @@ describe('i18n support in the view compiler', () => {
const $MSG_EXTERNAL_355394464191978948$$APP_SPEC_TS__0$ = goog.getMsg("Some content: {$interpolation}", {
"interpolation": "\uFFFD0\uFFFD"
});
function Template_0(rf, ctx) {
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $MSG_EXTERNAL_355394464191978948$$APP_SPEC_TS__0$);
$r3$.ɵpipe(1, "uppercase");
@ -1340,7 +1340,7 @@ describe('i18n support in the view compiler', () => {
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, Template_0, 2, 3);
$r3$.ɵtemplate(0, MyComponent_ng_template_Template_0, 2, 3, "ng-template");
}
}
`;
@ -1365,7 +1365,7 @@ describe('i18n support in the view compiler', () => {
"closeTagNgContainer": "\uFFFD/#3\uFFFD",
"interpolation": "\uFFFD0:1\uFFFD"
});
function Template_2(rf, ctx) {
function MyComponent_ng_template_Template_2(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $MSG_EXTERNAL_702706566400598764$$APP_SPEC_TS_0$, 1);
$r3$.ɵpipe(1, "uppercase");
@ -1383,7 +1383,7 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $MSG_EXTERNAL_702706566400598764$$APP_SPEC_TS_0$);
$r3$.ɵtemplate(2, Template_2, 2, 3);
$r3$.ɵtemplate(2, MyComponent_ng_template_Template_2, 2, 3, "ng-template");
$r3$.ɵelementContainerStart(3);
$r3$.ɵpipe(4, "uppercase");
$r3$.ɵelementContainerEnd();
@ -1415,7 +1415,7 @@ describe('i18n support in the view compiler', () => {
const $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS__1$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_7842238767399919809$$APP_SPEC_TS__1$, {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
function Template_0(rf, ctx) {
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS__1$);
}
@ -1430,7 +1430,7 @@ describe('i18n support in the view compiler', () => {
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, Template_0, 1, 1);
$r3$.ɵtemplate(0, MyComponent_ng_template_Template_0, 1, 1, "ng-template");
$r3$.ɵelementContainerStart(1);
$r3$.ɵi18n(2, $I18N_EXTERNAL_8806993169187953163$$APP_SPEC_TS_0$);
$r3$.ɵelementContainerEnd();
@ -1461,7 +1461,7 @@ describe('i18n support in the view compiler', () => {
`;
const output = String.raw `
function Template_1(rf, ctx) {
function MyComponent_ng_template_ng_template_ng_template_Template_1(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $I18N_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$, 3);
}
@ -1471,10 +1471,10 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵi18nApply(0);
}
}
function Template_2(rf, ctx) {
function MyComponent_ng_template_ng_template_Template_2(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18nStart(0, $I18N_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$, 2);
$r3$.ɵtemplate(1, Template_1, 1, 1);
$r3$.ɵtemplate(1, MyComponent_ng_template_ng_template_ng_template_Template_1, 1, 1, "ng-template");
$r3$.ɵi18nEnd();
}
if (rf & 2) {
@ -1491,11 +1491,11 @@ describe('i18n support in the view compiler', () => {
"interpolation_2": "\uFFFD0:3\uFFFD"
});
const $I18N_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$);
function Template_2(rf, ctx) {
function MyComponent_ng_template_Template_2(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18nStart(0, $I18N_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$, 1);
$r3$.ɵpipe(1, "uppercase");
$r3$.ɵtemplate(2, Template_2, 2, 1);
$r3$.ɵtemplate(2, MyComponent_ng_template_ng_template_Template_2, 2, 1, "ng-template");
$r3$.ɵi18nEnd();
}
if (rf & 2) {
@ -1511,7 +1511,7 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $I18N_EXTERNAL_2051477021417799640$$APP_SPEC_TS_0$);
$r3$.ɵtemplate(2, Template_2, 3, 3);
$r3$.ɵtemplate(2, MyComponent_ng_template_Template_2, 3, 3, "ng-template");
$r3$.ɵi18nEnd();
$r3$.ɵelementEnd();
}
@ -1536,7 +1536,7 @@ describe('i18n support in the view compiler', () => {
const $I18N_EXTERNAL_8806993169187953163$$APP_SPEC_TS__1$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_8806993169187953163$$APP_SPEC_TS__1$, {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
function Template_2(rf, ctx) {
function MyComponent_ng_template_Template_2(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18n(0, $I18N_EXTERNAL_8806993169187953163$$APP_SPEC_TS__1$);
}
@ -1554,7 +1554,7 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵelementContainerStart(0);
$r3$.ɵi18n(1, $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS_0$);
$r3$.ɵelementContainerEnd();
$r3$.ɵtemplate(2, Template_2, 1, 1);
$r3$.ɵtemplate(2, MyComponent_ng_template_Template_2, 1, 1, "ng-template");
}
if (rf & 2) {
$r3$.ɵi18nExp($r3$.ɵbind(ctx.gender));
@ -1584,7 +1584,7 @@ describe('i18n support in the view compiler', () => {
const $MSG_EXTERNAL_461986953980355147$$APP_SPEC_TS__2$ = goog.getMsg("{$tagImg} is my logo #2 ", {
"tagImg": "\uFFFD#1\uFFFD\uFFFD/#1\uFFFD"
});
function Template_3(rf, ctx) {
function MyComponent_ng_template_Template_3(rf, ctx) {
if (rf & 1) {
$r3$.ɵi18nStart(0, $MSG_EXTERNAL_461986953980355147$$APP_SPEC_TS__2$);
$r3$.ɵelement(1, "img", $_c0$);
@ -1599,7 +1599,7 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵelement(2, "img", $_c0$);
$r3$.ɵi18nEnd();
$r3$.ɵelementContainerEnd();
$r3$.ɵtemplate(3, Template_3, 2, 0);
$r3$.ɵtemplate(3, MyComponent_ng_template_Template_3, 2, 0, "ng-template");
}
}
`;
@ -1749,8 +1749,8 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18n(1, $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS_0$);
$r3$.ɵelementEnd();
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 2, 1, null, $_c0$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 4, 2, null, $_c0$);
$r3$.ɵtemplate(2, MyComponent_div_Template_2, 2, 1, "div", $_c0$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 4, 2, "div", $_c0$);
}
if (rf & 2) {
$r3$.ɵi18nExp($r3$.ɵbind(ctx.gender));
@ -1976,7 +1976,7 @@ describe('i18n support in the view compiler', () => {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $I18N_APP_SPEC_TS_0$);
$r3$.ɵelement(2, "div");
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 2, 1, null, $_c3$);
$r3$.ɵtemplate(3, MyComponent_div_Template_3, 2, 1, "div", $_c3$);
$r3$.ɵi18nEnd();
$r3$.ɵelementEnd();
}
@ -2080,7 +2080,7 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $MSG_EXTERNAL_1194472282609532229$$APP_SPEC_TS_0$);
$r3$.ɵtemplate(2, MyComponent_span_Template_2, 2, 1, null, $_c2$);
$r3$.ɵtemplate(2, MyComponent_span_Template_2, 2, 1, "span", $_c2$);
$r3$.ɵi18nEnd();
$r3$.ɵelementEnd();
}
@ -2146,7 +2146,7 @@ describe('i18n support in the view compiler', () => {
if (rf & 1) {
$r3$.ɵelementStart(0, "div");
$r3$.ɵi18nStart(1, $MSG_EXTERNAL_7186042105600518133$$APP_SPEC_TS_0$);
$r3$.ɵtemplate(2, MyComponent_span_Template_2, 2, 2, null, $_c2$);
$r3$.ɵtemplate(2, MyComponent_span_Template_2, 2, 2, "span", $_c2$);
$r3$.ɵi18nEnd();
$r3$.ɵelementEnd();
}

2
packages/compiler-cli/test/compliance/r3_view_compiler_listener_spec.ts
View File

@ -160,7 +160,7 @@ describe('compiler compliance: listen()', () => {
// ...
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 3, 0, null, $c0$);
$r3$.ɵtemplate(0, MyComponent_div_Template_0, 3, 0, "div", $c0$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngIf", $i0$.ɵbind(ctx.showing));

30
packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts
View File

@ -82,7 +82,7 @@ describe('compiler compliance: template', () => {
function MyComponent_ul_li_Template_1(rf, ctx) {
if (rf & 1) {
$i0$.ɵelementStart(0, "li");
$i0$.ɵtemplate(1, MyComponent_ul_li_div_Template_1, 2, 2, null, _c0);
$i0$.ɵtemplate(1, MyComponent_ul_li_div_Template_1, 2, 2, "div", _c0);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -94,7 +94,7 @@ describe('compiler compliance: template', () => {
function MyComponent_ul_Template_0(rf, ctx) {
if (rf & 1) {
$i0$.ɵelementStart(0, "ul");
$i0$.ɵtemplate(1, MyComponent_ul_li_Template_1, 2, 1, null, _c0);
$i0$.ɵtemplate(1, MyComponent_ul_li_Template_1, 2, 1, "li", _c0);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -105,7 +105,7 @@ describe('compiler compliance: template', () => {
// ...
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵtemplate(0, MyComponent_ul_Template_0, 2, 1, null, _c0);
$i0$.ɵtemplate(0, MyComponent_ul_Template_0, 2, 1, "ul", _c0);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items));
@ -156,7 +156,7 @@ describe('compiler compliance: template', () => {
// ...
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵtemplate(0, MyComponent_span_Template_0, 2, 2, null, _c0);
$i0$.ɵtemplate(0, MyComponent_span_Template_0, 2, 2, "span", _c0);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items));
@ -212,7 +212,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_Template_0(rf, ctx) {
if (rf & 1) {
$i0$.ɵelementStart(0, "div");
$i0$.ɵtemplate(1, MyComponent_div_span_Template_1, 2, 2, null, $c1$);
$i0$.ɵtemplate(1, MyComponent_div_span_Template_1, 2, 2, "span", $c1$);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -224,7 +224,7 @@ describe('compiler compliance: template', () => {
// ...
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 2, 1, null, $c0$);
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 2, 1, "div", $c0$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items));
@ -280,7 +280,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_div_Template_1(rf, ctx) {
if (rf & 1) {
$i0$.ɵelementStart(0, "div");
$i0$.ɵtemplate(1, MyComponent_div_div_div_Template_1, 2, 2, null, _c0);
$i0$.ɵtemplate(1, MyComponent_div_div_div_Template_1, 2, 2, "div", _c0);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -292,7 +292,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_Template_0(rf, ctx) {
if (rf & 1) {
$i0$.ɵelementStart(0, "div");
$i0$.ɵtemplate(1, MyComponent_div_div_Template_1, 2, 1, null, _c0);
$i0$.ɵtemplate(1, MyComponent_div_div_Template_1, 2, 1, "div", _c0);
$i0$.ɵelementEnd();
}
if (rf & 2) {
@ -303,7 +303,7 @@ describe('compiler compliance: template', () => {
// ...
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 2, 1, null, _c0);
$i0$.ɵtemplate(0, MyComponent_div_Template_0, 2, 1, "div", _c0);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items));
@ -339,7 +339,7 @@ describe('compiler compliance: template', () => {
const template = `
const $c0$ = ["attr", "l", ${AttributeMarker.SelectOnly}, "boundAttr"];
function Template_0(rf, ctx) {
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$i0$.ɵtext(0, " some-content ");
}
@ -349,7 +349,7 @@ describe('compiler compliance: template', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵtemplate(0, Template_0, 1, 0, null, $c0$);
$i0$.ɵtemplate(0, MyComponent_ng_template_Template_0, 1, 0, "ng-template", $c0$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "boundAttr", $i0$.ɵbind(ctx.b));
@ -383,7 +383,7 @@ describe('compiler compliance: template', () => {
const template = `
const $t0_refs$ = ["foo", ""];
function Template_0(rf, ctx) {
function MyComponent_ng_template_Template_0(rf, ctx) {
if (rf & 1) {
$i0$.ɵtext(0, "some-content");
}
@ -393,7 +393,7 @@ describe('compiler compliance: template', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵtemplate(0, Template_0, 1, 0, null, null, $t0_refs$, $i0$.ɵtemplateRefExtractor);
$i0$.ɵtemplate(0, MyComponent_ng_template_Template_0, 1, 0, "ng-template", null, $t0_refs$, $i0$.ɵtemplateRefExtractor);
}
}`;
@ -424,13 +424,13 @@ describe('compiler compliance: template', () => {
const template = `
const $t0_attrs$ = [${AttributeMarker.SelectOnly}, "outDirective"];
function Template_0(rf, ctx) { }
function MyComponent_ng_template_Template_0(rf, ctx) { }
// ...
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵtemplate(0, Template_0, 0, 0, null, $t0_attrs$);
$i0$.ɵtemplate(0, MyComponent_ng_template_Template_0, 0, 0, "ng-template", $t0_attrs$);
$i0$.ɵlistener("outDirective", function MyComponent_Template_ng_template_outDirective_listener($event) { return $event.doSth(); });
}
}`;