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 9cc32663e8..4d051e5109 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 @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {MockDirectory, setup} from '@angular/compiler/test/aot/test_util'; +import {setup} from '@angular/compiler/test/aot/test_util'; import {compile, expectEmit} from './mock_compile'; describe('compiler compliance: template', () => { @@ -53,7 +53,7 @@ describe('compiler compliance: template', () => { const template = ` const $c0$ = ["ngFor","","ngForOf",""]; function MyComponent_ul_li_div_Template_1(rf, ctx) { - + if (rf & 1) { const $s$ = $i0$.ɵgV(); $i0$.ɵE(0, "div"); @@ -68,7 +68,7 @@ describe('compiler compliance: template', () => { $i0$.ɵT(1); $i0$.ɵe(); } - + if (rf & 2) { const $inner1$ = ctx.$implicit; const $middle1$ = $i0$.ɵx().$implicit; @@ -78,7 +78,7 @@ describe('compiler compliance: template', () => { $i0$.ɵt(1, $i0$.ɵi1(" ", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component), " ")); } } - + function MyComponent_ul_li_Template_1(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "li"); @@ -90,7 +90,7 @@ describe('compiler compliance: template', () => { $i0$.ɵp(1, "ngForOf", $i0$.ɵb($myComp2$.items)); } } - + function MyComponent_ul_Template_0(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "ul"); @@ -140,8 +140,8 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = ["ngFor","","ngForOf",""]; - + const $c0$ = ["ngFor", "", "ngForOf", ""]; + function MyComponent_span_Template_0(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "span"); @@ -194,9 +194,9 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = ["ngFor","","ngForOf",""]; - const $c1$ = ["ngIf",""]; - + const $c0$ = ["ngFor", "", "ngForOf", ""]; + const $c1$ = ["ngIf", ""]; + function MyComponent_div_span_Template_1(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "span"); @@ -210,7 +210,7 @@ describe('compiler compliance: template', () => { $i0$.ɵt(1, $i0$.ɵi2(" ", $i$, " - ", $item$, " ")); } } - + function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "div"); @@ -222,7 +222,7 @@ describe('compiler compliance: template', () => { $i0$.ɵp(1, "ngIf", $i0$.ɵb($app$.showing)); } } - + // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { @@ -266,7 +266,7 @@ describe('compiler compliance: template', () => { // The template should look like this (where IDENT is a wild card for an identifier): const template = ` - const $c0$ = ["ngFor","","ngForOf",""]; + const $c0$ = ["ngFor", "", "ngForOf", ""]; function MyComponent_div_div_div_Template_1(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "div"); @@ -279,7 +279,7 @@ describe('compiler compliance: template', () => { $i0$.ɵt(1, $i0$.ɵi2(" ", $middle$.value, " - ", $myComp$.name, " ")); } } - + function MyComponent_div_div_Template_1(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "div"); @@ -291,7 +291,7 @@ describe('compiler compliance: template', () => { $i0$.ɵp(1, "ngForOf", $i0$.ɵb($middle$.items)); } } - + function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { $i0$.ɵE(0, "div"); @@ -318,4 +318,50 @@ describe('compiler compliance: template', () => { expectEmit(result.source, template, 'Incorrect template'); }); + it('should support ', () => { + const files = { + app: { + 'spec.ts': ` + import {Component, NgModule} from '@angular/core'; + import {CommonModule} from '@angular/common'; + + @Component({ + selector: 'my-component', + template: \` + + some-content + \` + }) + export class MyComponent {} + + @NgModule({declarations: [MyComponent], imports: [CommonModule]}) + export class MyModule {} + ` + } + }; + + const template = ` + const $c0$ = ["attr", "", "boundAttr", ""]; + + function Template_0(rf, ctx) { + if (rf & 1) { + $i0$.ɵT(0, " some-content "); + } + } + + // ... + + template: function MyComponent_Template(rf, ctx) { + if (rf & 1) { + $i0$.ɵC(0, Template_0, null, $c0$); + } + if (rf & 2) { + $i0$.ɵp(0, "boundAttr", $i0$.ɵb(ctx.b)); + } + }`; + + const result = compile(files, angularFiles); + + expectEmit(result.source, template, 'Incorrect template'); + }); }); diff --git a/packages/compiler/src/render3/view/template.ts b/packages/compiler/src/render3/view/template.ts index 52eccac13d..b47609cde1 100644 --- a/packages/compiler/src/render3/view/template.ts +++ b/packages/compiler/src/render3/view/template.ts @@ -7,7 +7,6 @@ */ import {flatten, sanitizeIdentifier} from '../../compile_metadata'; -import {CompileReflector} from '../../compile_reflector'; import {BindingForm, BuiltinFunctionCall, LocalResolver, convertActionBinding, convertPropertyBinding} from '../../compiler_util/expression_converter'; import {ConstantPool} from '../../constant_pool'; import * as core from '../../core'; @@ -24,14 +23,14 @@ import {ParseError, ParseSourceSpan} from '../../parse_util'; import {DomElementSchemaRegistry} from '../../schema/dom_element_schema_registry'; import {CssSelector, SelectorMatcher} from '../../selector'; import {BindingParser} from '../../template_parser/binding_parser'; -import {OutputContext, error} from '../../util'; +import {error} from '../../util'; import * as t from '../r3_ast'; import {Identifiers as R3} from '../r3_identifiers'; import {htmlAstToRender3Ast} from '../r3_template_transform'; import {R3QueryMetadata} from './api'; import {parseStyle} from './styling'; -import {CONTEXT_NAME, I18N_ATTR, I18N_ATTR_PREFIX, ID_SEPARATOR, IMPLICIT_REFERENCE, MEANING_SEPARATOR, REFERENCE_PREFIX, RENDER_FLAGS, TEMPORARY_NAME, asLiteral, getQueryPredicate, invalid, mapToExpression, noop, temporaryAllocator, trimTrailingNulls, unsupported} from './util'; +import {CONTEXT_NAME, I18N_ATTR, I18N_ATTR_PREFIX, ID_SEPARATOR, IMPLICIT_REFERENCE, MEANING_SEPARATOR, REFERENCE_PREFIX, RENDER_FLAGS, asLiteral, invalid, mapToExpression, trimTrailingNulls, unsupported} from './util'; function mapBindingToInstruction(type: BindingType): o.ExternalReference|undefined { switch (type) { @@ -699,6 +698,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver o.TYPED_NULL_EXPR, ]; + // Match directives on both attributes and bound properties const attributeNames: o.Expression[] = []; const attributeMap: {[name: string]: string} = {}; @@ -707,7 +707,11 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver attributeMap[a.name] = a.value; }); - // Match directives on template attributes + template.inputs.forEach(i => { + attributeNames.push(asLiteral(i.name), asLiteral('')); + attributeMap[i.name] = ''; + }); + if (this.directiveMatcher) { const selector = createCssSelector('ng-template', attributeMap); this.directiveMatcher.match(