iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(core): separate refs from vars. 

Introduces `ref-` to give a name to an element or a directive (also works for `<template>` elements), and `let-` to introduce an input variable for a `<template>` element.

BREAKING CHANGE:
- `#...` now always means `ref-`.
- `<template #abc>` now defines a reference to the TemplateRef, instead of an input variable used inside of the template.
- `#...` inside of a *ngIf, … directives is deprecated.
  Use `let …` instead.
- `var-...` is deprecated. Replace with `let-...` for `<template>` elements and `ref-` for non `<template>` elements.

Closes #7158

Closes #8264
This commit is contained in:
Tobias Bosch 2016-04-25 19:52:24 -07:00
parent ff2ae7a2e1
commit d2efac18ed
69 changed files with 651 additions and 414 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
modules/angular2/docs/cheatsheet/built-in-directives.md
View File

@ -14,7 +14,7 @@ Removes or recreates a portion of the DOM tree based on the showSection expressi
@cheatsheetItem
syntax:
`<li *ngFor="#item of list">`|`*ngFor`
`<li *ngFor="let item of list">`|`*ngFor`
description:
Turns the li element and its contents into a template, and uses that to instantiate a view for each item in list.

2
modules/angular2/docs/core/01_templates.md
View File

@ -433,7 +433,7 @@ Finally, we can move the `ngFor` keyword to the left hand side and prefix it wit
```
<ul>
<li *ngFor="var person of people; var i=index">{{i}}. {{person}}<li>
<li *ngFor="let person of people; var i=index">{{i}}. {{person}}<li>
</ul>
```

2
modules/angular2/docs/core/10_view.md
View File

@ -94,7 +94,7 @@ Let's start with a View such as:
```
<ul>
<li template="ngFor: #person of people">{{person}}</li>
<li template="ngFor: let person of people">{{person}}</li>
</ul>
```

2
modules/angular2/examples/core/pipes/ts/slice_pipe/slice_pipe_example.ts
View File

@ -22,7 +22,7 @@ export class SlicePipeStringExample {
@Component({
selector: 'slice-list-example',
template: `<div>
<li *ngFor="var i of collection | slice:1:3">{{i}}</li>
<li *ngFor="let i of collection | slice:1:3">{{i}}</li>
</div>`
})
export class SlicePipeListExample {

2
modules/angular2/examples/router/ts/on_deactivate/on_deactivate_example.ts
View File

@ -36,7 +36,7 @@ class MyCmp implements OnDeactivate {
<router-outlet></router-outlet>
<div id="log">
<h2>Log:</h2>
<p *ngFor="#logItem of logService.logs">{{ logItem }}</p>
<p *ngFor="let logItem of logService.logs">{{ logItem }}</p>
</div>
`,
directives: [ROUTER_DIRECTIVES]

4
modules/angular2/http.ts
View File

@ -56,7 +56,7 @@ export {URLSearchParams} from './src/http/url_search_params';
* <div>
* <h1>People</h1>
* <ul>
* <li *ngFor="#person of people">
* <li *ngFor="let person of people">
* {{person.name}}
* </li>
* </ul>
@ -194,7 +194,7 @@ export const HTTP_BINDINGS = HTTP_PROVIDERS;
* <div>
* <h1>People</h1>
* <ul>
* <li *ngFor="#person of people">
* <li *ngFor="let person of people">
* {{person.name}}
* </li>
* </ul>

2
modules/angular2/src/common/directives/ng_for.ts
View File

@ -58,7 +58,7 @@ import {BaseException} from "../../facade/exceptions";
*
* ### Syntax
*
* - `<li *ngFor="#item of items; #i = index">...</li>`
* - `<li *ngFor="let item of items; #i = index">...</li>`
* - `<li template="ngFor #item of items; #i = index">...</li>`
* - `<template ngFor #item [ngForOf]="items" #i="index"><li>...</li></template>`
*

2
modules/angular2/src/common/forms/directives/select_control_value_accessor.ts
View File

@ -96,7 +96,7 @@ export class SelectControlValueAccessor implements ControlValueAccessor {
*
* ```
* <select ngControl="city">
* <option *ngFor="#c of cities" [value]="c"></option>
* <option *ngFor="let c of cities" [value]="c"></option>
* </select>
* ```
*/

8
modules/angular2/src/compiler/expression_parser/lexer.ts
View File

@ -46,7 +46,11 @@ export class Token {
isKeyword(): boolean { return (this.type == TokenType.Keyword); }
isKeywordVar(): boolean { return (this.type == TokenType.Keyword && this.strValue == "var"); }
isKeywordDeprecatedVar(): boolean {
return (this.type == TokenType.Keyword && this.strValue == "var");
}
isKeywordLet(): boolean { return (this.type == TokenType.Keyword && this.strValue == "let"); }
isKeywordNull(): boolean { return (this.type == TokenType.Keyword && this.strValue == "null"); }
@ -464,4 +468,4 @@ var OPERATORS = SetWrapper.createFromList([
var KEYWORDS =
SetWrapper.createFromList(['var', 'null', 'undefined', 'true', 'false', 'if', 'else']);
SetWrapper.createFromList(['var', 'let', 'null', 'undefined', 'true', 'false', 'if', 'else']);

42
modules/angular2/src/compiler/expression_parser/parser.ts
View File

@ -62,6 +62,10 @@ export class SplitInterpolation {
constructor(public strings: string[], public expressions: string[]) {}
}
export class TemplateBindingParseResult {
constructor(public templateBindings: TemplateBinding[], public warnings: string[]) {}
}
@Injectable()
export class Parser {
constructor(/** @internal */
@ -112,7 +116,7 @@ export class Parser {
return new Quote(prefix, uninterpretedExpression, location);
}
parseTemplateBindings(input: string, location: any): TemplateBinding[] {
parseTemplateBindings(input: string, location: any): TemplateBindingParseResult {
var tokens = this._lexer.tokenize(input);
return new _ParseAST(input, location, tokens, false).parseTemplateBindings();
}
@ -228,16 +232,11 @@ export class _ParseAST {
}
}
optionalKeywordVar(): boolean {
if (this.peekKeywordVar()) {
this.advance();
return true;
} else {
return false;
}
}
peekKeywordLet(): boolean { return this.next.isKeywordLet(); }
peekKeywordVar(): boolean { return this.next.isKeywordVar() || this.next.isOperator('#'); }
peekDeprecatedKeywordVar(): boolean { return this.next.isKeywordDeprecatedVar(); }
peekDeprecatedOperatorHash(): boolean { return this.next.isOperator('#'); }
expectCharacter(code: number) {
if (this.optionalCharacter(code)) return;
@ -617,11 +616,23 @@ export class _ParseAST {
return result.toString();
}
parseTemplateBindings(): any[] {
var bindings = [];
parseTemplateBindings(): TemplateBindingParseResult {
var bindings: TemplateBinding[] = [];
var prefix = null;
var warnings: string[] = [];
while (this.index < this.tokens.length) {
var keyIsVar: boolean = this.optionalKeywordVar();
var keyIsVar: boolean = this.peekKeywordLet();
if (!keyIsVar && this.peekDeprecatedKeywordVar()) {
keyIsVar = true;
warnings.push(`"var" inside of expressions is deprecated. Use "let" instead!`);
}
if (!keyIsVar && this.peekDeprecatedOperatorHash()) {
keyIsVar = true;
warnings.push(`"#" inside of expressions is deprecated. Use "let" instead!`);
}
if (keyIsVar) {
this.advance();
}
var key = this.expectTemplateBindingKey();
if (!keyIsVar) {
if (prefix == null) {
@ -639,7 +650,8 @@ export class _ParseAST {
} else {
name = '\$implicit';
}
} else if (this.next !== EOF && !this.peekKeywordVar()) {
} else if (this.next !== EOF && !this.peekKeywordLet() && !this.peekDeprecatedKeywordVar() &&
!this.peekDeprecatedOperatorHash()) {
var start = this.inputIndex;
var ast = this.parsePipe();
var source = this.input.substring(start, this.inputIndex);
@ -650,7 +662,7 @@ export class _ParseAST {
this.optionalCharacter($COMMA);
}
}
return bindings;
return new TemplateBindingParseResult(bindings, warnings);
}
error(message: string, index: number = null) {

8
modules/angular2/src/compiler/parse_util.ts
View File

@ -17,8 +17,14 @@ export class ParseSourceSpan {
}
}
export enum ParseErrorLevel {
WARNING,
FATAL
}
export abstract class ParseError {
constructor(public span: ParseSourceSpan, public msg: string) {}
constructor(public span: ParseSourceSpan, public msg: string,
public level: ParseErrorLevel = ParseErrorLevel.FATAL) {}
toString(): string {
var source = this.span.start.file.content;

9
modules/angular2/src/compiler/provider_parser.ts
View File

@ -6,7 +6,7 @@ import {
NgContentAst,
EmbeddedTemplateAst,
ElementAst,
VariableAst,
ReferenceAst,
BoundEventAst,
BoundElementPropertyAst,
AttrAst,
@ -69,7 +69,7 @@ export class ProviderElementContext {
constructor(private _viewContext: ProviderViewContext, private _parent: ProviderElementContext,
private _isViewRoot: boolean, private _directiveAsts: DirectiveAst[],
attrs: AttrAst[], vars: VariableAst[], private _sourceSpan: ParseSourceSpan) {
attrs: AttrAst[], refs: ReferenceAst[], private _sourceSpan: ParseSourceSpan) {
this._attrs = {};
attrs.forEach((attrAst) => this._attrs[attrAst.name] = attrAst.value);
var directivesMeta = _directiveAsts.map(directiveAst => directiveAst.directive);
@ -79,9 +79,8 @@ export class ProviderElementContext {
var queriedTokens = new CompileTokenMap<boolean>();
this._allProviders.values().forEach(
(provider) => { this._addQueryReadsTo(provider.token, queriedTokens); });
vars.forEach((varAst) => {
var varToken = new CompileTokenMetadata({value: varAst.name});
this._addQueryReadsTo(varToken, queriedTokens);
refs.forEach((refAst) => {
this._addQueryReadsTo(new CompileTokenMetadata({value: refAst.name}), queriedTokens);
});
if (isPresent(queriedTokens.get(identifierToken(Identifiers.ViewContainerRef)))) {
this._hasViewContainer = true;

1
modules/angular2/src/compiler/runtime_compiler.ts
View File

@ -30,7 +30,6 @@ import {
NgContentAst,
EmbeddedTemplateAst,
ElementAst,
VariableAst,
BoundEventAst,
BoundElementPropertyAst,
AttrAst,

29
modules/angular2/src/compiler/template_ast.ts
View File

@ -82,7 +82,18 @@ export class BoundEventAst implements TemplateAst {
}
/**
* A variable declaration on an element (e.g. `#var="expression"`).
* A reference declaration on an element (e.g. `let someName="expression"`).
*/
export class ReferenceAst implements TemplateAst {
constructor(public name: string, public value: CompileTokenMetadata,
public sourceSpan: ParseSourceSpan) {}
visit(visitor: TemplateAstVisitor, context: any): any {
return visitor.visitReference(this, context);
}
}
/**
* A variable declaration on a <template> (e.g. `var-someName="someLocalName"`).
*/
export class VariableAst implements TemplateAst {
constructor(public name: string, public value: string, public sourceSpan: ParseSourceSpan) {}
@ -97,7 +108,7 @@ export class VariableAst implements TemplateAst {
export class ElementAst implements TemplateAst {
constructor(public name: string, public attrs: AttrAst[],
public inputs: BoundElementPropertyAst[], public outputs: BoundEventAst[],
public exportAsVars: VariableAst[], public directives: DirectiveAst[],
public references: ReferenceAst[], public directives: DirectiveAst[],
public providers: ProviderAst[], public hasViewContainer: boolean,
public children: TemplateAst[], public ngContentIndex: number,
public sourceSpan: ParseSourceSpan) {}
@ -106,14 +117,6 @@ export class ElementAst implements TemplateAst {
return visitor.visitElement(this, context);
}
/**
* Whether the element has any active bindings (inputs, outputs, vars, or directives).
*/
isBound(): boolean {
return (this.inputs.length > 0 || this.outputs.length > 0 || this.exportAsVars.length > 0 ||
this.directives.length > 0);
}
/**
* Get the component associated with this element, if any.
*/
@ -132,7 +135,8 @@ export class ElementAst implements TemplateAst {
* A `<template>` element included in an Angular template.
*/
export class EmbeddedTemplateAst implements TemplateAst {
constructor(public attrs: AttrAst[], public outputs: BoundEventAst[], public vars: VariableAst[],
constructor(public attrs: AttrAst[], public outputs: BoundEventAst[],
public references: ReferenceAst[], public variables: VariableAst[],
public directives: DirectiveAst[], public providers: ProviderAst[],
public hasViewContainer: boolean, public children: TemplateAst[],
public ngContentIndex: number, public sourceSpan: ParseSourceSpan) {}
@ -160,7 +164,7 @@ export class DirectiveAst implements TemplateAst {
constructor(public directive: CompileDirectiveMetadata,
public inputs: BoundDirectivePropertyAst[],
public hostProperties: BoundElementPropertyAst[], public hostEvents: BoundEventAst[],
public exportAsVars: VariableAst[], public sourceSpan: ParseSourceSpan) {}
public sourceSpan: ParseSourceSpan) {}
visit(visitor: TemplateAstVisitor, context: any): any {
return visitor.visitDirective(this, context);
}
@ -232,6 +236,7 @@ export interface TemplateAstVisitor {
visitNgContent(ast: NgContentAst, context: any): any;
visitEmbeddedTemplate(ast: EmbeddedTemplateAst, context: any): any;
visitElement(ast: ElementAst, context: any): any;
visitReference(ast: ReferenceAst, context: any): any;
visitVariable(ast: VariableAst, context: any): any;
visitEvent(ast: BoundEventAst, context: any): any;
visitElementProperty(ast: BoundElementPropertyAst, context: any): any;

252
modules/angular2/src/compiler/template_parser.ts
View File

@ -13,6 +13,7 @@ import {
isArray
} from 'angular2/src/facade/lang';
import {Injectable, Inject, OpaqueToken, Optional} from 'angular2/core';
import {Console} from 'angular2/src/core/console';
import {BaseException} from 'angular2/src/facade/exceptions';
import {
AST,
@ -34,14 +35,14 @@ import {
} from './compile_metadata';
import {HtmlParser} from './html_parser';
import {splitNsName, mergeNsAndName} from './html_tags';
import {ParseSourceSpan, ParseError, ParseLocation} from './parse_util';
import {ParseSourceSpan, ParseError, ParseLocation, ParseErrorLevel} from './parse_util';
import {MAX_INTERPOLATION_VALUES} from 'angular2/src/core/linker/view_utils';
import {
ElementAst,
BoundElementPropertyAst,
BoundEventAst,
VariableAst,
ReferenceAst,
TemplateAst,
TemplateAstVisitor,
templateVisitAll,
@ -54,7 +55,8 @@ import {
DirectiveAst,
BoundDirectivePropertyAst,
ProviderAst,
ProviderAstType
ProviderAstType,
VariableAst
} from './template_ast';
import {CssSelector, SelectorMatcher} from 'angular2/src/compiler/selector';
@ -76,19 +78,22 @@ import {
} from './html_ast';
import {splitAtColon} from './util';
import {identifierToken, Identifiers} from './identifiers';
import {ProviderElementContext, ProviderViewContext} from './provider_parser';
// Group 1 = "bind-"
// Group 2 = "var-" or "#"
// Group 3 = "on-"
// Group 4 = "bindon-"
// Group 5 = the identifier after "bind-", "var-/#", or "on-"
// Group 6 = identifier inside [()]
// Group 7 = identifier inside []
// Group 8 = identifier inside ()
// Group 2 = "var-"
// Group 3 = "let-"
// Group 4 = "ref-/#"
// Group 5 = "on-"
// Group 6 = "bindon-"
// Group 7 = the identifier after "bind-", "var-/#", or "on-"
// Group 8 = identifier inside [()]
// Group 9 = identifier inside []
// Group 10 = identifier inside ()
var BIND_NAME_REGEXP =
/^(?:(?:(?:(bind-)|(var-|#)|(on-)|(bindon-))(.+))|\[\(([^\)]+)\)\]|\[([^\]]+)\]|\(([^\)]+)\))$/g;
/^(?:(?:(?:(bind-)|(var-)|(let-)|(ref-|#)|(on-)|(bindon-))(.+))|\[\(([^\)]+)\)\]|\[([^\]]+)\]|\(([^\)]+)\))$/g;
const TEMPLATE_ELEMENT = 'template';
const TEMPLATE_ATTR = 'template';
@ -112,7 +117,9 @@ var TEXT_CSS_SELECTOR = CssSelector.parse('*')[0];
export const TEMPLATE_TRANSFORMS = CONST_EXPR(new OpaqueToken('TemplateTransforms'));
export class TemplateParseError extends ParseError {
constructor(message: string, span: ParseSourceSpan) { super(span, message); }
constructor(message: string, span: ParseSourceSpan, level: ParseErrorLevel) {
super(span, message, level);
}
}
export class TemplateParseResult {
@ -122,15 +129,20 @@ export class TemplateParseResult {
@Injectable()
export class TemplateParser {
constructor(private _exprParser: Parser, private _schemaRegistry: ElementSchemaRegistry,
private _htmlParser: HtmlParser,
private _htmlParser: HtmlParser, private _console: Console,
@Optional() @Inject(TEMPLATE_TRANSFORMS) public transforms: TemplateAstVisitor[]) {}
parse(component: CompileDirectiveMetadata, template: string,
directives: CompileDirectiveMetadata[], pipes: CompilePipeMetadata[],
templateUrl: string): TemplateAst[] {
var result = this.tryParse(component, template, directives, pipes, templateUrl);
if (isPresent(result.errors)) {
var errorString = result.errors.join('\n');
var warnings = result.errors.filter(error => error.level === ParseErrorLevel.WARNING);
var errors = result.errors.filter(error => error.level === ParseErrorLevel.FATAL);
if (warnings.length > 0) {
this._console.warn(`Template parse warnings:\n${warnings.join('\n')}`);
}
if (errors.length > 0) {
var errorString = errors.join('\n');
throw new BaseException(`Template parse errors:\n${errorString}`);
}
return result.templateAst;
@ -162,7 +174,7 @@ export class TemplateParser {
this.transforms.forEach(
(transform: TemplateAstVisitor) => { result = templateVisitAll(transform, result); });
}
return new TemplateParseResult(result);
return new TemplateParseResult(result, errors);
}
}
@ -187,8 +199,9 @@ class TemplateParseVisitor implements HtmlAstVisitor {
pipes.forEach(pipe => this.pipesByName.set(pipe.name, pipe));
}
private _reportError(message: string, sourceSpan: ParseSourceSpan) {
this.errors.push(new TemplateParseError(message, sourceSpan));
private _reportError(message: string, sourceSpan: ParseSourceSpan,
level: ParseErrorLevel = ParseErrorLevel.FATAL) {
this.errors.push(new TemplateParseError(message, sourceSpan, level));
}
private _parseInterpolation(value: string, sourceSpan: ParseSourceSpan): ASTWithSource {
@ -235,13 +248,15 @@ class TemplateParseVisitor implements HtmlAstVisitor {
private _parseTemplateBindings(value: string, sourceSpan: ParseSourceSpan): TemplateBinding[] {
var sourceInfo = sourceSpan.start.toString();
try {
var bindings = this._exprParser.parseTemplateBindings(value, sourceInfo);
bindings.forEach((binding) => {
var bindingsResult = this._exprParser.parseTemplateBindings(value, sourceInfo);
bindingsResult.templateBindings.forEach((binding) => {
if (isPresent(binding.expression)) {
this._checkPipes(binding.expression, sourceSpan);
}
});
return bindings;
bindingsResult.warnings.forEach(
(warning) => { this._reportError(warning, sourceSpan, ParseErrorLevel.WARNING); });
return bindingsResult.templateBindings;
} catch (e) {
this._reportError(`${e}`, sourceSpan);
return [];
@ -299,19 +314,25 @@ class TemplateParseVisitor implements HtmlAstVisitor {
var matchableAttrs: string[][] = [];
var elementOrDirectiveProps: BoundElementOrDirectiveProperty[] = [];
var vars: VariableAst[] = [];
var elementOrDirectiveRefs: ElementOrDirectiveRef[] = [];
var elementVars: VariableAst[] = [];
var events: BoundEventAst[] = [];
var templateElementOrDirectiveProps: BoundElementOrDirectiveProperty[] = [];
var templateVars: VariableAst[] = [];
var templateMatchableAttrs: string[][] = [];
var templateElementVars: VariableAst[] = [];
var hasInlineTemplates = false;
var attrs = [];
var lcElName = splitNsName(nodeName.toLowerCase())[1];
var isTemplateElement = lcElName == TEMPLATE_ELEMENT;
element.attrs.forEach(attr => {
var hasBinding = this._parseAttr(attr, matchableAttrs, elementOrDirectiveProps, events, vars);
var hasBinding =
this._parseAttr(isTemplateElement, attr, matchableAttrs, elementOrDirectiveProps, events,
elementOrDirectiveRefs, elementVars);
var hasTemplateBinding = this._parseInlineTemplateBinding(
attr, templateMatchableAttrs, templateElementOrDirectiveProps, templateVars);
attr, templateMatchableAttrs, templateElementOrDirectiveProps, templateElementVars);
if (!hasBinding && !hasTemplateBinding) {
// don't include the bindings as attributes as well in the AST
attrs.push(this.visitAttr(attr, null));
@ -322,19 +343,18 @@ class TemplateParseVisitor implements HtmlAstVisitor {
}
});
var lcElName = splitNsName(nodeName.toLowerCase())[1];
var isTemplateElement = lcElName == TEMPLATE_ELEMENT;
var elementCssSelector = createElementCssSelector(nodeName, matchableAttrs);
var directiveMetas = this._parseDirectives(this.selectorMatcher, elementCssSelector);
var directiveAsts =
this._createDirectiveAsts(element.name, directiveMetas, elementOrDirectiveProps,
isTemplateElement ? [] : vars, element.sourceSpan);
var references: ReferenceAst[] = [];
var directiveAsts = this._createDirectiveAsts(isTemplateElement, element.name, directiveMetas,
elementOrDirectiveProps, elementOrDirectiveRefs,
element.sourceSpan, references);
var elementProps: BoundElementPropertyAst[] =
this._createElementPropertyAsts(element.name, elementOrDirectiveProps, directiveAsts);
var isViewRoot = parent.isTemplateElement || hasInlineTemplates;
var providerContext =
new ProviderElementContext(this.providerViewContext, parent.providerContext, isViewRoot,
directiveAsts, attrs, vars, element.sourceSpan);
directiveAsts, attrs, references, element.sourceSpan);
var children = htmlVisitAll(
preparsedElement.nonBindable ? NON_BINDABLE_VISITOR : this, element.children,
ElementContext.create(isTemplateElement, directiveAsts,
@ -362,17 +382,15 @@ class TemplateParseVisitor implements HtmlAstVisitor {
element.sourceSpan);
parsedElement = new EmbeddedTemplateAst(
attrs, events, vars, providerContext.transformedDirectiveAsts,
attrs, events, references, elementVars, providerContext.transformedDirectiveAsts,
providerContext.transformProviders, providerContext.transformedHasViewContainer, children,
hasInlineTemplates ? null : ngContentIndex, element.sourceSpan);
} else {
this._assertOnlyOneComponent(directiveAsts, element.sourceSpan);
var elementExportAsVars = vars.filter(varAst => varAst.value.length === 0);
let ngContentIndex =
hasInlineTemplates ? null : parent.findNgContentIndex(projectionSelector);
parsedElement = new ElementAst(
nodeName, attrs, elementProps, events, elementExportAsVars,
nodeName, attrs, elementProps, events, references,
providerContext.transformedDirectiveAsts, providerContext.transformProviders,
providerContext.transformedHasViewContainer, children,
hasInlineTemplates ? null : ngContentIndex, element.sourceSpan);
@ -381,18 +399,18 @@ class TemplateParseVisitor implements HtmlAstVisitor {
var templateCssSelector = createElementCssSelector(TEMPLATE_ELEMENT, templateMatchableAttrs);
var templateDirectiveMetas = this._parseDirectives(this.selectorMatcher, templateCssSelector);
var templateDirectiveAsts =
this._createDirectiveAsts(element.name, templateDirectiveMetas,
templateElementOrDirectiveProps, [], element.sourceSpan);
this._createDirectiveAsts(true, element.name, templateDirectiveMetas,
templateElementOrDirectiveProps, [], element.sourceSpan, []);
var templateElementProps: BoundElementPropertyAst[] = this._createElementPropertyAsts(
element.name, templateElementOrDirectiveProps, templateDirectiveAsts);
this._assertNoComponentsNorElementBindingsOnTemplate(
templateDirectiveAsts, templateElementProps, element.sourceSpan);
var templateProviderContext = new ProviderElementContext(
this.providerViewContext, parent.providerContext, parent.isTemplateElement,
templateDirectiveAsts, [], templateVars, element.sourceSpan);
templateDirectiveAsts, [], [], element.sourceSpan);
templateProviderContext.afterElement();
parsedElement = new EmbeddedTemplateAst([], [], templateVars,
parsedElement = new EmbeddedTemplateAst([], [], [], templateElementVars,
templateProviderContext.transformedDirectiveAsts,
templateProviderContext.transformProviders,
templateProviderContext.transformedHasViewContainer,
@ -417,7 +435,6 @@ class TemplateParseVisitor implements HtmlAstVisitor {
var binding = bindings[i];
if (binding.keyIsVar) {
targetVars.push(new VariableAst(binding.key, binding.name, attr.sourceSpan));
targetMatchableAttrs.push([binding.key, binding.name]);
} else if (isPresent(binding.expression)) {
this._parsePropertyAst(binding.key, binding.expression, attr.sourceSpan,
targetMatchableAttrs, targetProps);
@ -431,9 +448,10 @@ class TemplateParseVisitor implements HtmlAstVisitor {
return false;
}
private _parseAttr(attr: HtmlAttrAst, targetMatchableAttrs: string[][],
private _parseAttr(isTemplateElement: boolean, attr: HtmlAttrAst,
targetMatchableAttrs: string[][],
targetProps: BoundElementOrDirectiveProperty[], targetEvents: BoundEventAst[],
targetVars: VariableAst[]): boolean {
targetRefs: ElementOrDirectiveRef[], targetVars: VariableAst[]): boolean {
var attrName = this._normalizeAttributeName(attr.name);
var attrValue = attr.value;
var bindParts = RegExpWrapper.firstMatch(BIND_NAME_REGEXP, attrName);
@ -441,36 +459,55 @@ class TemplateParseVisitor implements HtmlAstVisitor {
if (isPresent(bindParts)) {
hasBinding = true;
if (isPresent(bindParts[1])) { // match: bind-prop
this._parseProperty(bindParts[5], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
} else if (isPresent(
bindParts[2])) { // match: var-name / var-name="iden" / #name / #name="iden"
var identifier = bindParts[5];
this._parseVariable(identifier, attrValue, attr.sourceSpan, targetVars);
} else if (isPresent(bindParts[3])) { // match: on-event
this._parseEvent(bindParts[5], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[4])) { // match: bindon-prop
this._parseProperty(bindParts[5], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
this._parseAssignmentEvent(bindParts[5], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[6])) { // match: [(expr)]
this._parseProperty(bindParts[6], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
this._parseAssignmentEvent(bindParts[6], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[7])) { // match: [expr]
this._parseProperty(bindParts[7], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
} else if (isPresent(bindParts[8])) { // match: (event)
this._parseEvent(bindParts[8], attrValue, attr.sourceSpan, targetMatchableAttrs,
} else if (isPresent(bindParts[2])) { // match: var-name / var-name="iden"
var identifier = bindParts[7];
if (isTemplateElement) {
this._reportError(`"var-" on <template> elements is deprecated. Use "let-" instead!`,
attr.sourceSpan, ParseErrorLevel.WARNING);
this._parseVariable(identifier, attrValue, attr.sourceSpan, targetVars);
} else {
this._reportError(`"var-" on non <template> elements is deprecated. Use "ref-" instead!`,
attr.sourceSpan, ParseErrorLevel.WARNING);
this._parseReference(identifier, attrValue, attr.sourceSpan, targetRefs);
}
} else if (isPresent(bindParts[3])) { // match: let-name
if (isTemplateElement) {
var identifier = bindParts[7];
this._parseVariable(identifier, attrValue, attr.sourceSpan, targetVars);
} else {
this._reportError(`"let-" is only supported on template elements.`, attr.sourceSpan);
}
} else if (isPresent(bindParts[4])) { // match: ref- / #iden
var identifier = bindParts[7];
this._parseReference(identifier, attrValue, attr.sourceSpan, targetRefs);
} else if (isPresent(bindParts[5])) { // match: on-event
this._parseEvent(bindParts[7], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[6])) { // match: bindon-prop
this._parseProperty(bindParts[7], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
this._parseAssignmentEvent(bindParts[7], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[8])) { // match: [(expr)]
this._parseProperty(bindParts[8], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
this._parseAssignmentEvent(bindParts[8], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
} else if (isPresent(bindParts[9])) { // match: [expr]
this._parseProperty(bindParts[9], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetProps);
} else if (isPresent(bindParts[10])) { // match: (event)
this._parseEvent(bindParts[10], attrValue, attr.sourceSpan, targetMatchableAttrs,
targetEvents);
}
} else {
@ -495,6 +532,14 @@ class TemplateParseVisitor implements HtmlAstVisitor {
targetVars.push(new VariableAst(identifier, value, sourceSpan));
}
private _parseReference(identifier: string, value: string, sourceSpan: ParseSourceSpan,
targetRefs: ElementOrDirectiveRef[]) {
if (identifier.indexOf('-') > -1) {
this._reportError(`"-" is not allowed in reference names`, sourceSpan);
}
targetRefs.push(new ElementOrDirectiveRef(identifier, value, sourceSpan));
}
private _parseProperty(name: string, expression: string, sourceSpan: ParseSourceSpan,
targetMatchableAttrs: string[][],
targetProps: BoundElementOrDirectiveProperty[]) {
@ -547,33 +592,28 @@ class TemplateParseVisitor implements HtmlAstVisitor {
private _parseDirectives(selectorMatcher: SelectorMatcher,
elementCssSelector: CssSelector): CompileDirectiveMetadata[] {
var directives = [];
selectorMatcher.match(elementCssSelector,
(selector, directive) => { directives.push(directive); });
// Need to sort the directives so that we get consistent results throughout,
// as selectorMatcher uses Maps inside.
// Also need to make components the first directive in the array
ListWrapper.sort(directives,
(dir1: CompileDirectiveMetadata, dir2: CompileDirectiveMetadata) => {
var dir1Comp = dir1.isComponent;
var dir2Comp = dir2.isComponent;
if (dir1Comp && !dir2Comp) {
return -1;
} else if (!dir1Comp && dir2Comp) {
return 1;
} else {
return this.directivesIndex.get(dir1) - this.directivesIndex.get(dir2);
}
// Also dedupe directives as they might match more than one time!
var directives = ListWrapper.createFixedSize(this.directivesIndex.size);
selectorMatcher.match(elementCssSelector, (selector, directive) => {
directives[this.directivesIndex.get(directive)] = directive;
});
return directives;
return directives.filter(dir => isPresent(dir));
}
private _createDirectiveAsts(elementName: string, directives: CompileDirectiveMetadata[],
private _createDirectiveAsts(isTemplateElement: boolean, elementName: string,
directives: CompileDirectiveMetadata[],
props: BoundElementOrDirectiveProperty[],
possibleExportAsVars: VariableAst[],
sourceSpan: ParseSourceSpan): DirectiveAst[] {
var matchedVariables = new Set<string>();
elementOrDirectiveRefs: ElementOrDirectiveRef[],
sourceSpan: ParseSourceSpan,
targetReferences: ReferenceAst[]): DirectiveAst[] {
var matchedReferences = new Set<string>();
var component: CompileDirectiveMetadata = null;
var directiveAsts = directives.map((directive: CompileDirectiveMetadata) => {
if (directive.isComponent) {
component = directive;
}
var hostProperties: BoundElementPropertyAst[] = [];
var hostEvents: BoundEventAst[] = [];
var directiveProperties: BoundDirectivePropertyAst[] = [];
@ -581,21 +621,29 @@ class TemplateParseVisitor implements HtmlAstVisitor {
hostProperties);
this._createDirectiveHostEventAsts(directive.hostListeners, sourceSpan, hostEvents);
this._createDirectivePropertyAsts(directive.inputs, props, directiveProperties);
var exportAsVars = [];
possibleExportAsVars.forEach((varAst) => {
if ((varAst.value.length === 0 && directive.isComponent) ||
(directive.exportAs == varAst.value)) {
exportAsVars.push(varAst);
matchedVariables.add(varAst.name);
elementOrDirectiveRefs.forEach((elOrDirRef) => {
if ((elOrDirRef.value.length === 0 && directive.isComponent) ||
(directive.exportAs == elOrDirRef.value)) {
targetReferences.push(new ReferenceAst(elOrDirRef.name, identifierToken(directive.type),
elOrDirRef.sourceSpan));
matchedReferences.add(elOrDirRef.name);
}
});
return new DirectiveAst(directive, directiveProperties, hostProperties, hostEvents,
exportAsVars, sourceSpan);
sourceSpan);
});
possibleExportAsVars.forEach((varAst) => {
if (varAst.value.length > 0 && !SetWrapper.has(matchedVariables, varAst.name)) {
this._reportError(`There is no directive with "exportAs" set to "${varAst.value}"`,
varAst.sourceSpan);
elementOrDirectiveRefs.forEach((elOrDirRef) => {
if (elOrDirRef.value.length > 0) {
if (!SetWrapper.has(matchedReferences, elOrDirRef.name)) {
this._reportError(`There is no directive with "exportAs" set to "${elOrDirRef.value}"`,
elOrDirRef.sourceSpan);
};
} else if (isBlank(component)) {
var refToken = null;
if (isTemplateElement) {
refToken = identifierToken(Identifiers.TemplateRef);
}
targetReferences.push(new ReferenceAst(elOrDirRef.name, refToken, elOrDirRef.sourceSpan));
}
});
return directiveAsts;
@ -793,6 +841,10 @@ class BoundElementOrDirectiveProperty {
public sourceSpan: ParseSourceSpan) {}
}
class ElementOrDirectiveRef {
constructor(public name: string, public value: string, public sourceSpan: ParseSourceSpan) {}
}
export function splitClasses(classAttrValue: string): string[] {
return StringWrapper.split(classAttrValue.trim(), /\s+/g);
}

29
modules/angular2/src/compiler/view_compiler/compile_element.ts
View File

@ -4,7 +4,7 @@ import {InjectMethodVars} from './constants';
import {CompileView} from './compile_view';
import {isPresent, isBlank} from 'angular2/src/facade/lang';
import {ListWrapper, StringMapWrapper} from 'angular2/src/facade/collection';
import {TemplateAst, ProviderAst, ProviderAstType} from '../template_ast';
import {TemplateAst, ProviderAst, ProviderAstType, ReferenceAst} from '../template_ast';
import {
CompileTokenMap,
CompileDirectiveMetadata,
@ -13,7 +13,7 @@ import {
CompileProviderMetadata,
CompileDiDependencyMetadata,
CompileIdentifierMetadata,
CompileTypeMetadata
CompileTypeMetadata,
} from '../compile_metadata';
import {getPropertyInView, createDiTokenExpression, injectFromViewParentInjector} from './util';
import {CompileQuery, createQueryList, addQueryToTokenMap} from './compile_query';
@ -30,7 +30,7 @@ export class CompileNode {
export class CompileElement extends CompileNode {
static createNull(): CompileElement {
return new CompileElement(null, null, null, null, null, null, [], [], false, false, {});
return new CompileElement(null, null, null, null, null, null, [], [], false, false, []);
}
private _compViewExpr: o.Expression = null;
@ -47,15 +47,18 @@ export class CompileElement extends CompileNode {
public contentNodesByNgContentIndex: Array<o.Expression>[] = null;
public embeddedView: CompileView;
public directiveInstances: o.Expression[];
public referenceTokens: {[key: string]: CompileTokenMetadata};
constructor(parent: CompileElement, view: CompileView, nodeIndex: number,
renderNode: o.Expression, sourceAst: TemplateAst,
public component: CompileDirectiveMetadata,
private _directives: CompileDirectiveMetadata[],
private _resolvedProvidersArray: ProviderAst[], public hasViewContainer: boolean,
public hasEmbeddedView: boolean,
public variableTokens: {[key: string]: CompileTokenMetadata}) {
public hasEmbeddedView: boolean, references: ReferenceAst[]) {
super(parent, view, nodeIndex, renderNode, sourceAst);
this.referenceTokens = {};
references.forEach(ref => this.referenceTokens[ref.name] = ref.value);
this.elementRef = o.importExpr(Identifiers.ElementRef).instantiate([this.renderNode]);
this._instances.add(identifierToken(Identifiers.ElementRef), this.elementRef);
this.injector = o.THIS_EXPR.callMethod('injector', [o.literal(this.nodeIndex)]);
@ -167,15 +170,15 @@ export class CompileElement extends CompileNode {
queriesWithReads,
queriesForProvider.map(query => new _QueryWithRead(query, resolvedProvider.token)));
});
StringMapWrapper.forEach(this.variableTokens, (_, varName) => {
var token = this.variableTokens[varName];
StringMapWrapper.forEach(this.referenceTokens, (_, varName) => {
var token = this.referenceTokens[varName];
var varValue;
if (isPresent(token)) {
varValue = this._instances.get(token);
} else {
varValue = this.renderNode;
}
this.view.variables.set(varName, varValue);
this.view.locals.set(varName, varValue);
var varToken = new CompileTokenMetadata({value: varName});
ListWrapper.addAll(queriesWithReads, this._getQueriesFor(varToken)
.map(query => new _QueryWithRead(query, varToken)));
@ -186,8 +189,8 @@ export class CompileElement extends CompileNode {
// query for an identifier
value = this._instances.get(queryWithRead.read);
} else {
// query for a variable
var token = this.variableTokens[queryWithRead.read.value];
// query for a reference
var token = this.referenceTokens[queryWithRead.read.value];
if (isPresent(token)) {
value = this._instances.get(token);
} else {
@ -247,12 +250,6 @@ export class CompileElement extends CompileNode {
(resolvedProvider) => createDiTokenExpression(resolvedProvider.token));
}
getDeclaredVariablesNames(): string[] {
var res = [];
StringMapWrapper.forEach(this.variableTokens, (_, key) => { res.push(key); });
return res;
}
private _getQueriesFor(token: CompileTokenMetadata): CompileQuery[] {
var result: CompileQuery[] = [];
var currentEl: CompileElement = this;

10
modules/angular2/src/compiler/view_compiler/compile_view.ts
View File

@ -56,7 +56,7 @@ export class CompileView implements NameResolver {
public componentView: CompileView;
public purePipes = new Map<string, CompilePipe>();
public pipes: CompilePipe[] = [];
public variables = new Map<string, o.Expression>();
public locals = new Map<string, o.Expression>();
public className: string;
public classType: o.Type;
public viewFactory: o.ReadVarExpr;
@ -112,7 +112,7 @@ export class CompileView implements NameResolver {
}
this.viewQueries = viewQueries;
templateVariableBindings.forEach((entry) => {
this.variables.set(entry[1], o.THIS_EXPR.prop('locals').key(o.literal(entry[0])));
this.locals.set(entry[1], o.THIS_EXPR.prop('locals').key(o.literal(entry[0])));
});
if (!this.declarationElement.isNull()) {
@ -133,15 +133,15 @@ export class CompileView implements NameResolver {
return pipe.call(this, [input].concat(args));
}
getVariable(name: string): o.Expression {
getLocal(name: string): o.Expression {
if (name == EventHandlerVars.event.name) {
return EventHandlerVars.event;
}
var currView: CompileView = this;
var result = currView.variables.get(name);
var result = currView.locals.get(name);
while (isBlank(result) && isPresent(currView.declarationElement.view)) {
currView = currView.declarationElement.view;
result = currView.variables.get(name);
result = currView.locals.get(name);
}
if (isPresent(result)) {
return getPropertyInView(result, this, currView);

10
modules/angular2/src/compiler/view_compiler/expression_converter.ts
View File

@ -9,7 +9,7 @@ var IMPLICIT_RECEIVER = o.variable('#implicit');
export interface NameResolver {
callPipe(name: string, input: o.Expression, args: o.Expression[]): o.Expression;
getVariable(name: string): o.Expression;
getLocal(name: string): o.Expression;
createLiteralArray(values: o.Expression[]): o.Expression;
createLiteralMap(values: Array<Array<string | o.Expression>>): o.Expression;
}
@ -185,7 +185,7 @@ class _AstToIrVisitor implements cdAst.AstVisitor {
var result = null;
var receiver = ast.receiver.visit(this, _Mode.Expression);
if (receiver === IMPLICIT_RECEIVER) {
var varExpr = this._nameResolver.getVariable(ast.name);
var varExpr = this._nameResolver.getLocal(ast.name);
if (isPresent(varExpr)) {
result = varExpr.callFn(args);
} else {
@ -204,7 +204,7 @@ class _AstToIrVisitor implements cdAst.AstVisitor {
var result = null;
var receiver = ast.receiver.visit(this, _Mode.Expression);
if (receiver === IMPLICIT_RECEIVER) {
result = this._nameResolver.getVariable(ast.name);
result = this._nameResolver.getLocal(ast.name);
if (isBlank(result)) {
receiver = this._implicitReceiver;
}
@ -217,9 +217,9 @@ class _AstToIrVisitor implements cdAst.AstVisitor {
visitPropertyWrite(ast: cdAst.PropertyWrite, mode: _Mode): any {
var receiver: o.Expression = ast.receiver.visit(this, _Mode.Expression);
if (receiver === IMPLICIT_RECEIVER) {
var varExpr = this._nameResolver.getVariable(ast.name);
var varExpr = this._nameResolver.getLocal(ast.name);
if (isPresent(varExpr)) {
throw new BaseException('Cannot reassign a variable binding');
throw new BaseException('Cannot assign to a reference or variable!');
}
receiver = this._implicitReceiver;
}

2
modules/angular2/src/compiler/view_compiler/view_binder.ts
View File

@ -7,6 +7,7 @@ import {
NgContentAst,
EmbeddedTemplateAst,
ElementAst,
ReferenceAst,
VariableAst,
BoundEventAst,
BoundElementPropertyAst,
@ -113,6 +114,7 @@ class ViewBinderVisitor implements TemplateAstVisitor {
return null;
}
visitReference(ast: ReferenceAst, ctx: any): any { return null; }
visitVariable(ast: VariableAst, ctx: any): any { return null; }
visitDirectiveProperty(ast: BoundDirectivePropertyAst, context: any): any { return null; }
visitElementProperty(ast: BoundElementPropertyAst, context: any): any { return null; }

30
modules/angular2/src/compiler/view_compiler/view_builder.ts
View File

@ -26,6 +26,7 @@ import {
NgContentAst,
EmbeddedTemplateAst,
ElementAst,
ReferenceAst,
VariableAst,
BoundEventAst,
BoundElementPropertyAst,
@ -201,8 +202,6 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
var component = ast.getComponent();
var directives = ast.directives.map(directiveAst => directiveAst.directive);
var variables =
_readHtmlAndDirectiveVariables(ast.exportAsVars, ast.directives, this.view.viewType);
var htmlAttrs = _readHtmlAttrs(ast.attrs);
var attrNameAndValues = _mergeHtmlAndDirectiveAttrs(htmlAttrs, directives);
for (var i = 0; i < attrNameAndValues.length; i++) {
@ -216,7 +215,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
}
var compileElement =
new CompileElement(parent, this.view, nodeIndex, renderNode, ast, component, directives,
ast.providers, ast.hasViewContainer, false, variables);
ast.providers, ast.hasViewContainer, false, ast.references);
this.view.nodes.push(compileElement);
var compViewExpr: o.ReadVarExpr = null;
if (isPresent(component)) {
@ -269,13 +268,13 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
.toStmt());
var renderNode = o.THIS_EXPR.prop(fieldName);
var templateVariableBindings = ast.vars.map(
var templateVariableBindings = ast.variables.map(
varAst => [varAst.value.length > 0 ? varAst.value : IMPLICIT_TEMPLATE_VAR, varAst.name]);
var directives = ast.directives.map(directiveAst => directiveAst.directive);
var compileElement =
new CompileElement(parent, this.view, nodeIndex, renderNode, ast, null, directives,
ast.providers, ast.hasViewContainer, true, {});
ast.providers, ast.hasViewContainer, true, ast.references);
this.view.nodes.push(compileElement);
this.nestedViewCount++;
@ -297,6 +296,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
return null;
}
visitReference(ast: ReferenceAst, ctx: any): any { return null; }
visitVariable(ast: VariableAst, ctx: any): any { return null; }
visitDirectiveProperty(ast: BoundDirectivePropertyAst, context: any): any { return null; }
visitElementProperty(ast: BoundElementPropertyAst, context: any): any { return null; }
@ -321,24 +321,6 @@ function _readHtmlAttrs(attrs: AttrAst[]): {[key: string]: string} {
return htmlAttrs;
}
function _readHtmlAndDirectiveVariables(elementExportAsVars: VariableAst[],
directives: DirectiveAst[],
viewType: ViewType): {[key: string]: CompileTokenMetadata} {
var variables: {[key: string]: CompileTokenMetadata} = {};
var component: CompileDirectiveMetadata = null;
directives.forEach((directive) => {
if (directive.directive.isComponent) {
component = directive.directive;
}
directive.exportAsVars.forEach(
varAst => { variables[varAst.name] = identifierToken(directive.directive.type); });
});
elementExportAsVars.forEach((varAst) => {
variables[varAst.name] = isPresent(component) ? identifierToken(component.type) : null;
});
return variables;
}
function mergeAttributeValue(attrName: string, attrValue1: string, attrValue2: string): string {
if (attrName == CLASS_ATTR || attrName == STYLE_ATTR) {
return `${attrValue1} ${attrValue2}`;
@ -392,7 +374,7 @@ function createStaticNodeDebugInfo(node: CompileNode): o.Expression {
if (isPresent(compileElement.component)) {
componentToken = createDiTokenExpression(identifierToken(compileElement.component.type));
}
StringMapWrapper.forEach(compileElement.variableTokens, (token, varName) => {
StringMapWrapper.forEach(compileElement.referenceTokens, (token, varName) => {
varTokenEntries.push(
[varName, isPresent(token) ? createDiTokenExpression(token) : o.NULL_EXPR]);
});

2
modules/angular2/src/core/change_detection/change_detector_ref.ts
View File

@ -70,7 +70,7 @@ export abstract class ChangeDetectorRef {
* @Component({
* selector: 'giant-list',
* template: `
* <li *ngFor="#d of dataProvider.data">Data {{d}}</lig>
* <li *ngFor="let d of dataProvider.data">Data {{d}}</lig>
* `,
* directives: [NgFor]
* })

8
modules/angular2/src/core/console.ts
View File

@ -1,7 +1,13 @@
import {Injectable} from 'angular2/src/core/di';
import {print} from 'angular2/src/facade/lang';
import {print, warn} from 'angular2/src/facade/lang';
// Note: Need to rename warn as in Dart
// class members and imports can't use the same name.
let _warnImpl = warn;
@Injectable()
export class Console {
log(message: string): void { print(message); }
// Note: for reporting errors use `DOM.logError()` as it is platform specific
warn(message: string): void { _warnImpl(message); }
}

12
modules/angular2/src/core/linker/debug_context.ts
View File

@ -8,7 +8,7 @@ import {ViewType} from './view_type';
@CONST()
export class StaticNodeDebugInfo {
constructor(public providerTokens: any[], public componentToken: any,
public varTokens: {[key: string]: any}) {}
public refTokens: {[key: string]: any}) {}
}
export class DebugContext implements RenderDebugInfo {
@ -61,15 +61,15 @@ export class DebugContext implements RenderDebugInfo {
ListWrapper.forEachWithIndex(
this._view.staticNodeDebugInfos,
(staticNodeInfo: StaticNodeDebugInfo, nodeIndex: number) => {
var vars = staticNodeInfo.varTokens;
StringMapWrapper.forEach(vars, (varToken, varName) => {
var refs = staticNodeInfo.refTokens;
StringMapWrapper.forEach(refs, (refToken, refName) => {
var varValue;
if (isBlank(varToken)) {
if (isBlank(refToken)) {
varValue = isPresent(this._view.allNodes) ? this._view.allNodes[nodeIndex] : null;
} else {
varValue = this._view.injectorGet(varToken, nodeIndex, null);
varValue = this._view.injectorGet(refToken, nodeIndex, null);
}
varValues[varName] = varValue;
varValues[refName] = varValue;
});
});
StringMapWrapper.forEach(this._view.locals,

2
modules/angular2/src/core/linker/query_list.ts
View File

@ -11,7 +11,7 @@ import {Observable, EventEmitter} from 'angular2/src/facade/async';
*
* Implements an iterable interface, therefore it can be used in both ES6
* javascript `for (var i of items)` loops as well as in Angular templates with
* `*ngFor="#i of myList"`.
* `*ngFor="let i of myList"`.
*
* Changes can be observed by subscribing to the changes `Observable`.
*

4
modules/angular2/src/core/linker/view_ref.ts
View File

@ -34,7 +34,7 @@ export abstract class ViewRef extends ChangeDetectorRef {
* ```
* Count: {{items.length}}
* <ul>
* <li *ngFor="var item of items">{{item}}</li>
* <li *ngFor="let item of items">{{item}}</li>
* </ul>
* ```
*
@ -44,7 +44,7 @@ export abstract class ViewRef extends ChangeDetectorRef {
* ```
* Count: {{items.length}}
* <ul>
* <template ngFor var-item [ngForOf]="items"></template>
* <template ngFor let-item [ngForOf]="items"></template>
* </ul>
* ```
*

4
modules/angular2/src/core/metadata.ts
View File

@ -964,7 +964,7 @@ export var Attribute: AttributeMetadataFactory = makeParamDecorator(AttributeMet
* ```html
* <tabs>
* <pane title="Overview">...</pane>
* <pane *ngFor="#o of objects" [title]="o.title">{{o.text}}</pane>
* <pane *ngFor="let o of objects" [title]="o.title">{{o.text}}</pane>
* </tabs>
* ```
*
@ -983,7 +983,7 @@ export var Attribute: AttributeMetadataFactory = makeParamDecorator(AttributeMet
* selector: 'tabs',
* template: `
* <ul>
* <li *ngFor="#pane of panes">{{pane.title}}</li>
* <li *ngFor="let pane of panes">{{pane.title}}</li>
* </ul>
* <ng-content></ng-content>
* `

4
modules/angular2/src/core/metadata/di.ts
View File

@ -46,7 +46,7 @@ export class AttributeMetadata extends DependencyMetadata {
* ```html
* <tabs>
* <pane title="Overview">...</pane>
* <pane *ngFor="#o of objects" [title]="o.title">{{o.text}}</pane>
* <pane *ngFor="let o of objects" [title]="o.title">{{o.text}}</pane>
* </tabs>
* ```
*
@ -65,7 +65,7 @@ export class AttributeMetadata extends DependencyMetadata {
* selector: 'tabs',
* template: `
* <ul>
* <li *ngFor="#pane of panes">{{pane.title}}</li>
* <li *ngFor="let pane of panes">{{pane.title}}</li>
* </ul>
* <ng-content></ng-content>
* `

2
modules/angular2/src/core/metadata/lifecycle_hooks.ts
View File

@ -149,7 +149,7 @@ export interface OnInit { ngOnInit(); }
* template: `
* <p>Changes:</p>
* <ul>
* <li *ngFor="#line of logs">{{line}}</li>
* <li *ngFor="let line of logs">{{line}}</li>
* </ul>`,
* directives: [NgFor]
* })

2
modules/angular2/src/core/metadata/view.ts
View File

@ -104,7 +104,7 @@ export class ViewMetadata {
* directives: [NgFor]
* template: '
* <ul>
* <li *ngFor="#item of items">{{item}}</li>
* <li *ngFor="let item of items">{{item}}</li>
* </ul>'
* })
* class MyComponent {

4
modules/angular2/src/facade/lang.dart
View File

@ -298,6 +298,10 @@ bool isJsObject(o) {
return false;
}
warn(o) {
print(o);
}
// Functions below are noop in Dart. Imperatively controlling dev mode kills
// tree shaking. We should only rely on `assertionsEnabled`.
@Deprecated('Do not use this function. It is for JS only. There is no alternative.')

4
modules/angular2/src/facade/lang.ts
View File

@ -408,6 +408,10 @@ export function print(obj: Error | Object) {
console.log(obj);
}
export function warn(obj: Error | Object) {
console.warn(obj);
}
// Can't be all uppercase as our transpiler would think it is a special directive...
export class Json {
static parse(s: string): Object { return _global.JSON.parse(s); }

6
modules/angular2/src/router/directives/router_link_transform.ts
View File

@ -185,11 +185,13 @@ export class RouterLinkTransform implements TemplateAstVisitor {
let updatedChildren = ast.children.map(c => c.visit(this, context));
let updatedInputs = ast.inputs.map(c => c.visit(this, context));
let updatedDirectives = ast.directives.map(c => c.visit(this, context));
return new ElementAst(ast.name, ast.attrs, updatedInputs, ast.outputs, ast.exportAsVars,
return new ElementAst(ast.name, ast.attrs, updatedInputs, ast.outputs, ast.references,
updatedDirectives, ast.providers, ast.hasViewContainer, updatedChildren,
ast.ngContentIndex, ast.sourceSpan);
}
visitReference(ast: any, context: any): any { return ast; }
visitVariable(ast: any, context: any): any { return ast; }
visitEvent(ast: any, context: any): any { return ast; }
@ -205,7 +207,7 @@ export class RouterLinkTransform implements TemplateAstVisitor {
visitDirective(ast: DirectiveAst, context: any): any {
let updatedInputs = ast.inputs.map(c => c.visit(this, context));
return new DirectiveAst(ast.directive, updatedInputs, ast.hostProperties, ast.hostEvents,
ast.exportAsVars, ast.sourceSpan);
ast.sourceSpan);
}
visitDirectiveProperty(ast: BoundDirectivePropertyAst, context: any): any {

2
modules/angular2/test/common/directives/ng_class_spec.ts
View File

@ -29,7 +29,7 @@ export function main() {
it('should clean up when the directive is destroyed',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div *ngFor="var item of items" [ngClass]="item"></div>';
var template = '<div *ngFor="let item of items" [ngClass]="item"></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((fixture) => {

46
modules/angular2/test/common/directives/ng_for_spec.ts
View File

@ -23,7 +23,7 @@ import {By} from 'angular2/platform/common_dom';
export function main() {
describe('ngFor', () => {
var TEMPLATE =
'<div><copy-me template="ngFor #item of items">{{item.toString()}};</copy-me></div>';
'<div><copy-me template="ngFor let item of items">{{item.toString()}};</copy-me></div>';
it('should reflect initial elements',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
@ -100,7 +100,7 @@ export function main() {
it('should iterate over an array of objects',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<ul><li template="ngFor #item of items">{{item["name"]}};</li></ul>';
var template = '<ul><li template="ngFor let item of items">{{item["name"]}};</li></ul>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -130,7 +130,7 @@ export function main() {
it('should gracefully handle nulls',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<ul><li template="ngFor #item of null">{{item}};</li></ul>';
var template = '<ul><li template="ngFor let item of null">{{item}};</li></ul>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((fixture) => {
@ -207,8 +207,8 @@ export function main() {
it('should repeat over nested arrays',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div>' +
'<div template="ngFor #item of items">' +
'<div template="ngFor #subitem of item">' +
'<div template="ngFor let item of items">' +
'<div template="ngFor let subitem of item">' +
'{{subitem}}-{{item.length}};' +
'</div>|' +
'</div>' +
@ -233,8 +233,8 @@ export function main() {
it('should repeat over nested arrays with no intermediate element',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<div><template ngFor #item [ngForOf]="items">' +
'<div template="ngFor #subitem of item">' +
var template = '<div><template ngFor let-item [ngForOf]="items">' +
'<div template="ngFor let subitem of item">' +
'{{subitem}}-{{item.length}};' +
'</div></template></div>';
@ -255,7 +255,7 @@ export function main() {
it('should repeat over nested ngIf that are the last node in the ngFor temlate',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
`<div><template ngFor #item [ngForOf]="items" #i="index"><div>{{i}}|</div>` +
`<div><template ngFor let-item [ngForOf]="items" let-i="index"><div>{{i}}|</div>` +
`<div *ngIf="i % 2 == 0">even|</div></template></div>`;
tcb.overrideTemplate(TestComponent, template)
@ -282,7 +282,7 @@ export function main() {
it('should display indices correctly',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div><copy-me template="ngFor: var item of items; var i=index">{{i.toString()}}</copy-me></div>';
'<div><copy-me template="ngFor: let item of items; let i=index">{{i.toString()}}</copy-me></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -301,7 +301,7 @@ export function main() {
it('should display first item correctly',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div><copy-me template="ngFor: var item of items; var isFirst=first">{{isFirst.toString()}}</copy-me></div>';
'<div><copy-me template="ngFor: let item of items; let isFirst=first">{{isFirst.toString()}}</copy-me></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -320,7 +320,7 @@ export function main() {
it('should display last item correctly',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div><copy-me template="ngFor: var item of items; var isLast=last">{{isLast.toString()}}</copy-me></div>';
'<div><copy-me template="ngFor: let item of items; let isLast=last">{{isLast.toString()}}</copy-me></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -339,7 +339,7 @@ export function main() {
it('should display even items correctly',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div><copy-me template="ngFor: var item of items; var isEven=even">{{isEven.toString()}}</copy-me></div>';
'<div><copy-me template="ngFor: let item of items; let isEven=even">{{isEven.toString()}}</copy-me></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -358,7 +358,7 @@ export function main() {
it('should display odd items correctly',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div><copy-me template="ngFor: var item of items; var isOdd=odd">{{isOdd.toString()}}</copy-me></div>';
'<div><copy-me template="ngFor: let item of items; let isOdd=odd">{{isOdd.toString()}}</copy-me></div>';
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
@ -381,7 +381,7 @@ export function main() {
'<ul><template ngFor [ngForOf]="items" [ngForTemplate]="contentTpl"></template></ul>')
.overrideTemplate(
ComponentUsingTestComponent,
'<test-cmp><li template="#item #i=index">{{i}}: {{item}};</li></test-cmp>')
'<test-cmp><li template="let item; let i=index">{{i}}: {{item}};</li></test-cmp>')
.createAsync(ComponentUsingTestComponent)
.then((fixture) => {
var testComponent = fixture.debugElement.children[0];
@ -395,8 +395,8 @@ export function main() {
it('should use a default template if a custom one is null',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.overrideTemplate(TestComponent, `<ul><template ngFor #item [ngForOf]="items"
[ngForTemplate]="contentTpl" #i="index">{{i}}: {{item}};</template></ul>`)
tcb.overrideTemplate(TestComponent, `<ul><template ngFor let-item [ngForOf]="items"
[ngForTemplate]="contentTpl" let-i="index">{{i}}: {{item}};</template></ul>`)
.overrideTemplate(ComponentUsingTestComponent, '<test-cmp></test-cmp>')
.createAsync(ComponentUsingTestComponent)
.then((fixture) => {
@ -411,11 +411,11 @@ export function main() {
it('should use a custom template when both default and a custom one are present',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.overrideTemplate(TestComponent, `<ul><template ngFor #item [ngForOf]="items"
[ngForTemplate]="contentTpl" #i="index">{{i}}=> {{item}};</template></ul>`)
tcb.overrideTemplate(TestComponent, `<ul><template ngFor let-item [ngForOf]="items"
[ngForTemplate]="contentTpl" let-i="index">{{i}}=> {{item}};</template></ul>`)
.overrideTemplate(
ComponentUsingTestComponent,
'<test-cmp><li template="#item #i=index">{{i}}: {{item}};</li></test-cmp>')
'<test-cmp><li template="let item; let i=index">{{i}}: {{item}};</li></test-cmp>')
.createAsync(ComponentUsingTestComponent)
.then((fixture) => {
var testComponent = fixture.debugElement.children[0];
@ -431,7 +431,7 @@ export function main() {
it('should not replace tracked items',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
`<template ngFor #item [ngForOf]="items" [ngForTrackBy]="trackById" #i="index">
`<template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById" let-i="index">
<p>{{items[i]}}</p>
</template>`;
tcb.overrideTemplate(TestComponent, template)
@ -453,7 +453,7 @@ export function main() {
it('should update implicit local variable on view',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
`<div><template ngFor #item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
`<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((fixture) => {
@ -469,7 +469,7 @@ export function main() {
it('should move items around and keep them updated ',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
`<div><template ngFor #item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
`<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackById">{{item['color']}}</template></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((fixture) => {
@ -488,7 +488,7 @@ export function main() {
it('should handle added and removed items properly when tracking by index',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
`<div><template ngFor #item [ngForOf]="items" [ngForTrackBy]="trackByIndex">{{item}}</template></div>`;
`<div><template ngFor let-item [ngForOf]="items" [ngForTrackBy]="trackByIndex">{{item}}</template></div>`;
tcb.overrideTemplate(TestComponent, template)
.createAsync(TestComponent)
.then((fixture) => {

16
modules/angular2/test/common/forms/integration_spec.ts
View File

@ -448,7 +448,7 @@ export function main() {
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
var t = `<select>
<option *ngFor="#city of list" [value]="city['id']">
<option *ngFor="let city of list" [value]="city['id']">
{{ city['name'] }}
</option>
</select>`;
@ -503,7 +503,7 @@ export function main() {
fakeAsync(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
var t = `<div [ngFormModel]="form">
<select ngControl="city">
<option *ngFor="#c of data" [value]="c"></option>
<option *ngFor="let c of data" [value]="c"></option>
</select>
</div>`;
@ -528,7 +528,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list" [ngValue]="c">{{c['name']}}</option>
<option *ngFor="let c of list" [ngValue]="c">{{c['name']}}</option>
</select>
</div>`;
@ -560,7 +560,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list" [ngValue]="c">{{c['name']}}</option>
<option *ngFor="let c of list" [ngValue]="c">{{c['name']}}</option>
</select>
</div>`;
@ -588,7 +588,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list" [ngValue]="c">{{c}}</option>
<option *ngFor="let c of list" [ngValue]="c">{{c}}</option>
</select>
</div>`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
@ -614,7 +614,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list; trackBy:customTrackBy" [ngValue]="c">{{c}}</option>
<option *ngFor="let c of list; trackBy:customTrackBy" [ngValue]="c">{{c}}</option>
</select>
</div>`;
@ -644,7 +644,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list" [ngValue]="c">{{c}}</option>
<option *ngFor="let c of list" [ngValue]="c">{{c}}</option>
</select>
</div>`;
@ -673,7 +673,7 @@ export function main() {
(tcb: TestComponentBuilder, async) => {
var t = `<div>
<select [(ngModel)]="selectedCity">
<option *ngFor="#c of list" [ngValue]="c">{{c['name']}}</option>
<option *ngFor="let c of list" [ngValue]="c">{{c['name']}}</option>
</select>
</div>`;

57
modules/angular2/test/compiler/expression_parser/parser_spec.ts
View File

@ -17,7 +17,7 @@ export function main() {
}
function parseTemplateBindings(text, location = null): any {
return createParser().parseTemplateBindings(text, location);
return createParser().parseTemplateBindings(text, location).templateBindings;
}
function parseInterpolation(text, location = null): any {
@ -293,7 +293,7 @@ export function main() {
function keyValues(templateBindings: any[]) {
return templateBindings.map(binding => {
if (binding.keyIsVar) {
return '#' + binding.key + (isBlank(binding.name) ? '=null' : '=' + binding.name);
return 'let ' + binding.key + (isBlank(binding.name) ? '=null' : '=' + binding.name);
} else {
return binding.key + (isBlank(binding.expression) ? '' : `=${binding.expression}`)
}
@ -339,8 +339,8 @@ export function main() {
});
it('should detect names as value', () => {
var bindings = parseTemplateBindings("a:#b");
expect(keyValues(bindings)).toEqual(['a', '#b=\$implicit']);
var bindings = parseTemplateBindings("a:let b");
expect(keyValues(bindings)).toEqual(['a', 'let b=\$implicit']);
});
it('should allow space and colon as separators', () => {
@ -370,31 +370,46 @@ export function main() {
expect(bindings[0].expression.location).toEqual('location');
});
it('should support var/# notation', () => {
var bindings = parseTemplateBindings("var i");
expect(keyValues(bindings)).toEqual(['#i=\$implicit']);
it('should support var notation with a deprecation warning', () => {
var bindings = createParser().parseTemplateBindings("var i", null);
expect(keyValues(bindings.templateBindings)).toEqual(['let i=\$implicit']);
expect(bindings.warnings)
.toEqual(['"var" inside of expressions is deprecated. Use "let" instead!']);
});
bindings = parseTemplateBindings("#i");
expect(keyValues(bindings)).toEqual(['#i=\$implicit']);
it('should support # notation with a deprecation warning', () => {
var bindings = createParser().parseTemplateBindings("#i", null);
expect(keyValues(bindings.templateBindings)).toEqual(['let i=\$implicit']);
expect(bindings.warnings)
.toEqual(['"#" inside of expressions is deprecated. Use "let" instead!']);
});
bindings = parseTemplateBindings("var a; var b");
expect(keyValues(bindings)).toEqual(['#a=\$implicit', '#b=\$implicit']);
it('should support let notation', () => {
var bindings = parseTemplateBindings("let i");
expect(keyValues(bindings)).toEqual(['let i=\$implicit']);
bindings = parseTemplateBindings("#a; #b;");
expect(keyValues(bindings)).toEqual(['#a=\$implicit', '#b=\$implicit']);
bindings = parseTemplateBindings("let i");
expect(keyValues(bindings)).toEqual(['let i=\$implicit']);
bindings = parseTemplateBindings("var i-a = k-a");
expect(keyValues(bindings)).toEqual(['#i-a=k-a']);
bindings = parseTemplateBindings("let a; let b");
expect(keyValues(bindings)).toEqual(['let a=\$implicit', 'let b=\$implicit']);
bindings = parseTemplateBindings("keyword var item; var i = k");
expect(keyValues(bindings)).toEqual(['keyword', '#item=\$implicit', '#i=k']);
bindings = parseTemplateBindings("let a; let b;");
expect(keyValues(bindings)).toEqual(['let a=\$implicit', 'let b=\$implicit']);
bindings = parseTemplateBindings("keyword: #item; #i = k");
expect(keyValues(bindings)).toEqual(['keyword', '#item=\$implicit', '#i=k']);
bindings = parseTemplateBindings("let i-a = k-a");
expect(keyValues(bindings)).toEqual(['let i-a=k-a']);
bindings = parseTemplateBindings("directive: var item in expr; var a = b", 'location');
bindings = parseTemplateBindings("keyword let item; let i = k");
expect(keyValues(bindings)).toEqual(['keyword', 'let item=\$implicit', 'let i=k']);
bindings = parseTemplateBindings("keyword: let item; let i = k");
expect(keyValues(bindings)).toEqual(['keyword', 'let item=\$implicit', 'let i=k']);
bindings = parseTemplateBindings("directive: let item in expr; let a = b", 'location');
expect(keyValues(bindings))
.toEqual(['directive', '#item=\$implicit', 'directiveIn=expr in location', '#a=b']);
.toEqual(
['directive', 'let item=\$implicit', 'directiveIn=expr in location', 'let a=b']);
});
it('should parse pipes', () => {

5
modules/angular2/test/compiler/offline_compiler_util.ts
View File

@ -1,5 +1,6 @@
import {print, IS_DART} from 'angular2/src/facade/lang';
import {OutputEmitter} from 'angular2/src/compiler/output/abstract_emitter';
import {Console} from 'angular2/src/core/console';
import {
OfflineCompiler,
@ -48,8 +49,8 @@ function _createOfflineCompiler(xhr: MockXHR, emitter: OutputEmitter): OfflineCo
var htmlParser = new HtmlParser();
var normalizer = new DirectiveNormalizer(xhr, urlResolver, htmlParser);
return new OfflineCompiler(
normalizer,
new TemplateParser(new Parser(new Lexer()), new MockSchemaRegistry({}, {}), htmlParser, []),
normalizer, new TemplateParser(new Parser(new Lexer()), new MockSchemaRegistry({}, {}),
htmlParser, new Console(), []),
new StyleCompiler(urlResolver), new ViewCompiler(new CompilerConfig(true, true, true)),
emitter);
}

221
modules/angular2/test/compiler/template_parser_spec.ts
View File

@ -11,6 +11,7 @@ import {
beforeEachProviders
} from 'angular2/testing_internal';
import {provide} from 'angular2/src/core/di';
import {Console} from 'angular2/src/core/console';
import {TEST_PROVIDERS} from './test_bindings';
import {isPresent, CONST_EXPR} from 'angular2/src/facade/lang';
@ -36,6 +37,7 @@ import {
NgContentAst,
EmbeddedTemplateAst,
ElementAst,
ReferenceAst,
VariableAst,
BoundEventAst,
BoundElementPropertyAst,
@ -47,6 +49,7 @@ import {
DirectiveAst,
ProviderAstType
} from 'angular2/src/compiler/template_ast';
import {identifierToken, Identifiers} from 'angular2/src/compiler/identifiers';
import {ElementSchemaRegistry} from 'angular2/src/compiler/schema/element_schema_registry';
import {MockSchemaRegistry} from './schema_registry_mock';
@ -66,8 +69,13 @@ var MOCK_SCHEMA_REGISTRY = [
export function main() {
var ngIf;
var parse;
var console: ArrayConsole;
function commonBeforeEach() {
beforeEachProviders(() => {
console = new ArrayConsole();
return [provide(Console, {useValue: console})];
});
beforeEach(inject([TemplateParser], (parser) => {
var component = CompileDirectiveMetadata.create({
selector: 'root',
@ -310,7 +318,7 @@ export function main() {
});
describe('directives', () => {
it('should locate directives components first and ordered by the directives array in the View',
it('should order directives by the directives array in the View and match them only once',
() => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
@ -324,19 +332,14 @@ export function main() {
selector: '[c]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirC'})
});
var comp = CompileDirectiveMetadata.create({
selector: 'div',
isComponent: true,
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'ZComp'}),
template: new CompileTemplateMetadata({ngContentSelectors: []})
});
expect(humanizeTplAst(parse('<div a c b>', [dirA, dirB, dirC, comp])))
expect(humanizeTplAst(parse('<div a c b a b>', [dirA, dirB, dirC])))
.toEqual([
[ElementAst, 'div'],
[AttrAst, 'a', ''],
[AttrAst, 'c', ''],
[AttrAst, 'b', ''],
[DirectiveAst, comp],
[AttrAst, 'a', ''],
[AttrAst, 'b', ''],
[DirectiveAst, dirA],
[DirectiveAst, dirB],
[DirectiveAst, dirC]
@ -747,29 +750,41 @@ export function main() {
});
});
describe('variables', () => {
describe('references', () => {
it('should parse variables via #... and not report them as attributes', () => {
it('should parse references via #... and not report them as attributes', () => {
expect(humanizeTplAst(parse('<div #a>', [])))
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
});
it('should parse variables via var-... and not report them as attributes', () => {
it('should parse references via ref-... and not report them as attributes', () => {
expect(humanizeTplAst(parse('<div ref-a>', [])))
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
});
it('should parse references via var-... and report them as deprecated', () => {
expect(humanizeTplAst(parse('<div var-a>', [])))
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
expect(console.warnings)
.toEqual([
[
'Template parse warnings:',
'"var-" on non <template> elements is deprecated. Use "ref-" instead! ("<div [ERROR ->]var-a>"): TestComp@0:5'
].join('\n')
]);
});
it('should parse camel case variables', () => {
expect(humanizeTplAst(parse('<div var-someA>', [])))
.toEqual([[ElementAst, 'div'], [VariableAst, 'someA', '']]);
it('should parse camel case references', () => {
expect(humanizeTplAst(parse('<div ref-someA>', [])))
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'someA', null]]);
});
it('should assign variables with empty value to the element', () => {
it('should assign references with empty value to the element', () => {
expect(humanizeTplAst(parse('<div #a></div>', [])))
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
});
it('should assign variables to directives via exportAs', () => {
it('should assign references to directives via exportAs', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'}),
@ -779,28 +794,27 @@ export function main() {
.toEqual([
[ElementAst, 'div'],
[AttrAst, 'a', ''],
[ReferenceAst, 'a', identifierToken(dirA.type)],
[DirectiveAst, dirA],
[VariableAst, 'a', 'dirA']
]);
});
it('should report variables with values that dont match a directive as errors', () => {
it('should report references with values that dont match a directive as errors', () => {
expect(() => parse('<div #a="dirA"></div>', [])).toThrowError(`Template parse errors:
There is no directive with "exportAs" set to "dirA" ("<div [ERROR ->]#a="dirA"></div>"): TestComp@0:5`);
});
it('should report invalid variable names', () => {
it('should report invalid reference names', () => {
expect(() => parse('<div #a-b></div>', [])).toThrowError(`Template parse errors:
"-" is not allowed in variable names ("<div [ERROR ->]#a-b></div>"): TestComp@0:5`);
"-" is not allowed in reference names ("<div [ERROR ->]#a-b></div>"): TestComp@0:5`);
});
it('should allow variables with values that dont match a directive on embedded template elements',
() => {
expect(humanizeTplAst(parse('<template #a="b"></template>', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b']]);
it('should report variables as errors', () => {
expect(() => parse('<div let-a></div>', [])).toThrowError(`Template parse errors:
"let-" is only supported on template elements. ("<div [ERROR ->]let-a></div>"): TestComp@0:5`);
});
it('should assign variables with empty value to components', () => {
it('should assign references with empty value to components', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
isComponent: true,
@ -812,12 +826,19 @@ There is no directive with "exportAs" set to "dirA" ("<div [ERROR ->]#a="dirA"><
.toEqual([
[ElementAst, 'div'],
[AttrAst, 'a', ''],
[VariableAst, 'a', ''],
[ReferenceAst, 'a', identifierToken(dirA.type)],
[DirectiveAst, dirA],
[VariableAst, 'a', '']
]);
});
it('should not locate directives in references', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'})
});
expect(humanizeTplAst(parse('<div ref-a>', [dirA])))
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
});
});
describe('explicit templates', () => {
@ -836,6 +857,49 @@ There is no directive with "exportAs" set to "dirA" ("<div [ERROR ->]#a="dirA"><
[EmbeddedTemplateAst],
]);
});
it('should support references via #...', () => {
expect(humanizeTplAst(parse('<template #a>', [])))
.toEqual([
[EmbeddedTemplateAst],
[ReferenceAst, 'a', identifierToken(Identifiers.TemplateRef)]
]);
});
it('should support references via ref-...', () => {
expect(humanizeTplAst(parse('<template ref-a>', [])))
.toEqual([
[EmbeddedTemplateAst],
[ReferenceAst, 'a', identifierToken(Identifiers.TemplateRef)]
]);
});
it('should parse variables via let-...', () => {
expect(humanizeTplAst(parse('<template let-a="b">', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b']]);
});
it('should parse variables via var-... and report them as deprecated', () => {
expect(humanizeTplAst(parse('<template var-a="b">', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b']]);
expect(console.warnings)
.toEqual([
[
'Template parse warnings:',
'"var-" on <template> elements is deprecated. Use "let-" instead! ("<template [ERROR ->]var-a="b">"): TestComp@0:10'
].join('\n')
]);
});
it('should not locate directives in variables', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'})
});
expect(humanizeTplAst(parse('<template let-a="b"></template>', [dirA])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b']]);
});
});
describe('inline templates', () => {
@ -854,13 +918,32 @@ There is no directive with "exportAs" set to "dirA" ("<div [ERROR ->]#a="dirA"><
]);
});
it('should parse variables via #...', () => {
expect(humanizeTplAst(parse('<div template="ngIf #a=b">', [])))
it('should parse variables via #... and report them as deprecated', () => {
expect(humanizeTplAst(parse('<div *ngIf="#a=b">', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
expect(console.warnings)
.toEqual([
[
'Template parse warnings:',
'"#" inside of expressions is deprecated. Use "let" instead! ("<div [ERROR ->]*ngIf="#a=b">"): TestComp@0:5'
].join('\n')
]);
});
it('should parse variables via var ...', () => {
expect(humanizeTplAst(parse('<div template="ngIf var a=b">', [])))
it('should parse variables via var ... and report them as deprecated', () => {
expect(humanizeTplAst(parse('<div *ngIf="var a=b">', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
expect(console.warnings)
.toEqual([
[
'Template parse warnings:',
'"var" inside of expressions is deprecated. Use "let" instead! ("<div [ERROR ->]*ngIf="var a=b">"): TestComp@0:5'
].join('\n')
]);
});
it('should parse variables via let ...', () => {
expect(humanizeTplAst(parse('<div *ngIf="let a=b">', [])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
});
@ -886,24 +969,22 @@ There is no directive with "exportAs" set to "dirA" ("<div [ERROR ->]#a="dirA"><
]);
});
it('should locate directives in variable bindings', () => {
it('should not locate directives in variables', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a=b]',
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'})
});
var dirB = CompileDirectiveMetadata.create({
selector: '[b]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirB'})
expect(humanizeTplAst(parse('<div template="let a=b">', [dirA])))
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
});
expect(humanizeTplAst(parse('<div template="#a=b" b>', [dirA, dirB])))
.toEqual([
[EmbeddedTemplateAst],
[VariableAst, 'a', 'b'],
[DirectiveAst, dirA],
[ElementAst, 'div'],
[AttrAst, 'b', ''],
[DirectiveAst, dirB]
]);
it('should not locate directives in references', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'})
});
expect(humanizeTplAst(parse('<div ref-a>', [dirA])))
.toEqual([[ElementAst, 'div'], [ReferenceAst, 'a', null]]);
});
});
@ -1248,22 +1329,20 @@ Property binding a not used by any directive on an embedded template ("[ERROR ->
});
it('should support variables', () => {
var dirA = CompileDirectiveMetadata.create({
selector: '[a]',
type: new CompileTypeMetadata({moduleUrl: someModuleUrl, name: 'DirA'}),
exportAs: 'dirA'
it('should support references', () => {
expect(humanizeTplAstSourceSpans(parse('<div #a></div>', [])))
.toEqual([[ElementAst, 'div', '<div #a>'], [ReferenceAst, 'a', null, '#a']]);
});
expect(humanizeTplAstSourceSpans(parse('<div a #a="dirA"></div>', [dirA])))
it('should support variables', () => {
expect(humanizeTplAstSourceSpans(parse('<template let-a="b"></template>', [])))
.toEqual([
[ElementAst, 'div', '<div a #a="dirA">'],
[AttrAst, 'a', '', 'a'],
[DirectiveAst, dirA, '<div a #a="dirA">'],
[VariableAst, 'a', 'dirA', '#a="dirA"']
[EmbeddedTemplateAst, '<template let-a="b">'],
[VariableAst, 'a', 'b', 'let-a="b"']
]);
});
it('should support event', () => {
it('should support events', () => {
expect(humanizeTplAstSourceSpans(parse('<div (window:event)="v">', [])))
.toEqual([
[ElementAst, 'div', '<div (window:event)="v">'],
@ -1311,8 +1390,8 @@ Property binding a not used by any directive on an embedded template ("[ERROR ->
.toEqual([
[ElementAst, 'div', '<div a>'],
[AttrAst, 'a', '', 'a'],
[DirectiveAst, comp, '<div a>'],
[DirectiveAst, dirA, '<div a>'],
[DirectiveAst, comp, '<div a>']
]);
});
@ -1399,7 +1478,8 @@ class TemplateHumanizer implements TemplateAstVisitor {
this.result.push(this._appendContext(ast, res));
templateVisitAll(this, ast.attrs);
templateVisitAll(this, ast.outputs);
templateVisitAll(this, ast.vars);
templateVisitAll(this, ast.references);
templateVisitAll(this, ast.variables);
templateVisitAll(this, ast.directives);
templateVisitAll(this, ast.children);
return null;
@ -1410,11 +1490,16 @@ class TemplateHumanizer implements TemplateAstVisitor {
templateVisitAll(this, ast.attrs);
templateVisitAll(this, ast.inputs);
templateVisitAll(this, ast.outputs);
templateVisitAll(this, ast.exportAsVars);
templateVisitAll(this, ast.references);
templateVisitAll(this, ast.directives);
templateVisitAll(this, ast.children);
return null;
}
visitReference(ast: ReferenceAst, context: any): any {
var res = [ReferenceAst, ast.name, ast.value];
this.result.push(this._appendContext(ast, res));
return null;
}
visitVariable(ast: VariableAst, context: any): any {
var res = [VariableAst, ast.name, ast.value];
this.result.push(this._appendContext(ast, res));
@ -1457,7 +1542,6 @@ class TemplateHumanizer implements TemplateAstVisitor {
templateVisitAll(this, ast.inputs);
templateVisitAll(this, ast.hostProperties);
templateVisitAll(this, ast.hostEvents);
templateVisitAll(this, ast.exportAsVars);
return null;
}
visitDirectiveProperty(ast: BoundDirectivePropertyAst, context: any): any {
@ -1499,6 +1583,7 @@ class TemplateContentProjectionHumanizer implements TemplateAstVisitor {
templateVisitAll(this, ast.children);
return null;
}
visitReference(ast: ReferenceAst, context: any): any { return null; }
visitVariable(ast: VariableAst, context: any): any { return null; }
visitEvent(ast: BoundEventAst, context: any): any { return null; }
visitElementProperty(ast: BoundElementPropertyAst, context: any): any { return null; }
@ -1523,6 +1608,7 @@ class FooAstTransformer implements TemplateAstVisitor {
return new ElementAst('foo', [], [], [], [], [], [], false, [], ast.ngContentIndex,
ast.sourceSpan);
}
visitReference(ast: ReferenceAst, context: any): any { throw 'not implemented'; }
visitVariable(ast: VariableAst, context: any): any { throw 'not implemented'; }
visitEvent(ast: BoundEventAst, context: any): any { throw 'not implemented'; }
visitElementProperty(ast: BoundElementPropertyAst, context: any): any { throw 'not implemented'; }
@ -1542,3 +1628,10 @@ class BarAstTransformer extends FooAstTransformer {
ast.sourceSpan);
}
}
class ArrayConsole implements Console {
logs: string[] = [];
warnings: string[] = [];
log(msg: string) { this.logs.push(msg); }
warn(msg: string) { this.warnings.push(msg); }
}

1
modules/angular2/test/core/application_ref_spec.ts
View File

@ -179,4 +179,5 @@ class _MockComponentRef extends ComponentRef_ {
class _MockConsole implements Console {
log(message) {}
warn(message) {}
}

4
modules/angular2/test/core/debug/debug_node_spec.ts
View File

@ -132,9 +132,9 @@ class ConditionalParentComp {
@Component({
selector: 'using-for',
viewProviders: [Logger],
template: `<span *ngFor="#thing of stuff" [innerHtml]="thing"></span>
template: `<span *ngFor="let thing of stuff" [innerHtml]="thing"></span>
<ul message="list">
<li *ngFor="#item of stuff" [innerHtml]="item"></li>
<li *ngFor="let item of stuff" [innerHtml]="item"></li>
</ul>`,
directives: [NgFor, MessageDir],
})

2
modules/angular2/test/core/forward_ref_integration_spec.ts
View File

@ -50,7 +50,7 @@ class App {
@Component({
selector: 'lock',
directives: [NgFor],
template: `{{frame.name}}(<span *ngFor="var lock of locks">{{lock.name}}</span>)`,
template: `{{frame.name}}(<span *ngFor="let lock of locks">{{lock.name}}</span>)`,
})
class Door {
locks: QueryList<Lock>;

6
modules/angular2/test/core/linker/change_detection_integration_spec.ts
View File

@ -438,7 +438,7 @@ export function main() {
it('should read locals', fakeAsync(() => {
var ctx =
createCompFixture('<template testLocals var-local="someLocal">{{local}}</template>');
createCompFixture('<template testLocals let-local="someLocal">{{local}}</template>');
ctx.detectChanges(false);
expect(renderLog.log).toEqual(['{{someLocalValue}}']);
@ -581,7 +581,7 @@ export function main() {
it('should throw when trying to assign to a local', fakeAsync(() => {
expect(() => {_bindSimpleProp('(event)="$event=1"')})
.toThrowError(new RegExp("Cannot reassign a variable binding"));
.toThrowError(new RegExp("Cannot assign to a reference or variable!"));
}));
it('should support short-circuiting', fakeAsync(() => {
@ -609,7 +609,7 @@ export function main() {
it('should read directive properties', fakeAsync(() => {
var ctx =
createCompFixture(
'<div testDirective [a]="42" var-dir="testDirective" [someProp]="dir.a"></div>')
'<div testDirective [a]="42" ref-dir="testDirective" [someProp]="dir.a"></div>')
ctx.detectChanges(false);
expect(renderLog.loggedValues).toEqual([42]);
}));

2
modules/angular2/test/core/linker/integration_dart_spec.dart
View File

@ -259,7 +259,7 @@ class OnChangeComponent implements OnChanges {
])
@View(
template:
'<span *ngFor="#item of list">{{item}}</span><directive-logging-checks></directive-logging-checks>',
'<span *ngFor="let item of list">{{item}}</span><directive-logging-checks></directive-logging-checks>',
directives: const [NgFor, DirectiveLoggingChecks])
class ComponentWithObservableList {
Iterable list;

51
modules/angular2/test/core/linker/integration_spec.ts
View File

@ -89,7 +89,7 @@ import {EmbeddedViewRef} from 'angular2/src/core/linker/view_ref';
import {ComponentResolver} from 'angular2/src/core/linker/component_resolver';
import {ElementRef} from 'angular2/src/core/linker/element_ref';
import {TemplateRef} from 'angular2/src/core/linker/template_ref';
import {TemplateRef_, TemplateRef} from 'angular2/src/core/linker/template_ref';
import {Renderer} from 'angular2/src/core/render';
@ -473,7 +473,7 @@ function declareTests(isJit: boolean) {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<template some-viewport var-greeting="some-tmpl"><copy-me>{{greeting}}</copy-me></template>',
'<template some-viewport let-greeting="some-tmpl"><copy-me>{{greeting}}</copy-me></template>',
directives: [SomeViewport]
}))
@ -509,7 +509,7 @@ function declareTests(isJit: boolean) {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<copy-me template="some-viewport: var greeting=some-tmpl">{{greeting}}</copy-me>',
'<copy-me template="some-viewport: let greeting=some-tmpl">{{greeting}}</copy-me>',
directives: [SomeViewport]
}))
@ -531,7 +531,7 @@ function declareTests(isJit: boolean) {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<some-directive><toolbar><template toolbarpart var-toolbarProp="toolbarProp">{{ctxProp}},{{toolbarProp}},<cmp-with-host></cmp-with-host></template></toolbar></some-directive>',
'<some-directive><toolbar><template toolbarpart let-toolbarProp="toolbarProp">{{ctxProp}},{{toolbarProp}},<cmp-with-host></cmp-with-host></template></toolbar></some-directive>',
directives: [SomeDirective, CompWithHost, ToolbarComponent, ToolbarPart]
}))
.createAsync(MyComp)
@ -547,12 +547,12 @@ function declareTests(isJit: boolean) {
});
}));
describe("variable bindings", () => {
it('should assign a component to a var-',
describe("reference bindings", () => {
it('should assign a component to a ref-',
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<p><child-cmp var-alice></child-cmp></p>',
template: '<p><child-cmp ref-alice></child-cmp></p>',
directives: [ChildComp]
}))
@ -564,7 +564,7 @@ function declareTests(isJit: boolean) {
async.done();
})}));
it('should assign a directive to a var-',
it('should assign a directive to a ref-',
inject(
[TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
@ -588,7 +588,7 @@ function declareTests(isJit: boolean) {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<template [ngIf]="true">{{alice.ctxProp}}</template>|{{alice.ctxProp}}|<child-cmp var-alice></child-cmp>',
'<template [ngIf]="true">{{alice.ctxProp}}</template>|{{alice.ctxProp}}|<child-cmp ref-alice></child-cmp>',
directives: [ChildComp, NgIf]
}))
@ -600,14 +600,14 @@ function declareTests(isJit: boolean) {
async.done();
})}));
it('should assign two component instances each with a var-',
it('should assign two component instances each with a ref-',
inject(
[TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<p><child-cmp var-alice></child-cmp><child-cmp var-bob></child-cmp></p>',
'<p><child-cmp ref-alice></child-cmp><child-cmp ref-bob></child-cmp></p>',
directives: [ChildComp]
}))
@ -622,7 +622,7 @@ function declareTests(isJit: boolean) {
async.done();
})}));
it('should assign the component instance to a var- with shorthand syntax',
it('should assign the component instance to a ref- with shorthand syntax',
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder,
async) => {tcb.overrideView(MyComp, new ViewMetadata({
@ -643,7 +643,7 @@ function declareTests(isJit: boolean) {
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<div><div var-alice><i>Hello</i></div></div>'
template: '<div><div ref-alice><i>Hello</i></div></div>'
}))
.createAsync(MyComp)
@ -657,11 +657,26 @@ function declareTests(isJit: boolean) {
async.done();
})}));
it('should assign the TemplateRef to a user-defined variable',
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata(
{template: '<template ref-alice></template>'}))
.createAsync(MyComp)
.then((fixture) => {
var value = fixture.debugElement.childNodes[0].getLocal('alice');
expect(value).toBeAnInstanceOf(TemplateRef_);
async.done();
})}));
it('should preserve case',
inject(
[TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<p><child-cmp var-superAlice></child-cmp></p>',
template: '<p><child-cmp ref-superAlice></child-cmp></p>',
directives: [ChildComp]
}))
@ -673,14 +688,16 @@ function declareTests(isJit: boolean) {
async.done();
});
}));
});
describe('variables', () => {
it('should allow to use variables in a for loop',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder,
async) => {
tcb.overrideView(
MyComp, new ViewMetadata({
template:
'<template ngFor [ngForOf]="[1]" var-i><child-cmp-no-template #cmp></child-cmp-no-template>{{i}}-{{cmp.ctxProp}}</template>',
'<template ngFor [ngForOf]="[1]" let-i><child-cmp-no-template #cmp></child-cmp-no-template>{{i}}-{{cmp.ctxProp}}</template>',
directives: [ChildCompNoTemplate, NgFor]
}))
@ -2281,7 +2298,7 @@ class ToolbarViewContainer {
@Component({
selector: 'toolbar',
template: 'TOOLBAR(<div *ngFor="var part of query" [toolbarVc]="part"></div>)',
template: 'TOOLBAR(<div *ngFor="let part of query" [toolbarVc]="part"></div>)',
directives: [ToolbarViewContainer, NgFor]
})
@Injectable()
@ -2489,7 +2506,7 @@ class DirectiveThrowingAnError {
@Component({
selector: 'component-with-template',
directives: [NgFor],
template: `No View Decorator: <div *ngFor="#item of items">{{item}}</div>`
template: `No View Decorator: <div *ngFor="let item of items">{{item}}</div>`
})
class ComponentWithTemplate {
items = [1, 2, 3];

73
modules/angular2/test/core/linker/query_integration_spec.ts
View File

@ -246,7 +246,7 @@ export function main() {
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<div text="1"></div>' +
'<needs-query text="2"><div *ngFor="var i of list" [text]="i"></div></needs-query>' +
'<needs-query text="2"><div *ngFor="let i of list" [text]="i"></div></needs-query>' +
'<div text="4"></div>';
tcb.overrideTemplate(MyComp, template)
@ -268,7 +268,7 @@ export function main() {
describe('query for TemplateRef', () => {
it('should find TemplateRefs in the light and shadow dom',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-tpl><template var-x="light"></template></needs-tpl>';
var template = '<needs-tpl><template let-x="light"></template></needs-tpl>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
@ -284,6 +284,23 @@ export function main() {
});
}));
it('should find named TemplateRefs',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-named-tpl><template let-x="light" #tpl></template></needs-named-tpl>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var needsTpl: NeedsNamedTpl = view.debugElement.children[0].inject(NeedsNamedTpl);
expect(needsTpl.vc.createEmbeddedView(needsTpl.contentTpl).hasLocal('light'))
.toBe(true);
expect(needsTpl.vc.createEmbeddedView(needsTpl.viewTpl).hasLocal('shadow'))
.toBe(true);
async.done();
});
}));
});
describe('read a different token', () => {
@ -462,9 +479,10 @@ export function main() {
describe("querying by var binding", () => {
it('should contain all the child directives in the light dom with the given var binding',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-binding #q>' +
'<div *ngFor="#item of list" [text]="item" #textLabel="textDir"></div>' +
'</needs-query-by-var-binding>';
var template =
'<needs-query-by-ref-binding #q>' +
'<div *ngFor="let item of list" [text]="item" #textLabel="textDir"></div>' +
'</needs-query-by-ref-binding>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
@ -484,10 +502,10 @@ export function main() {
it('should support querying by multiple var bindings',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-bindings #q>' +
var template = '<needs-query-by-ref-bindings #q>' +
'<div text="one" #textLabel1="textDir"></div>' +
'<div text="two" #textLabel2="textDir"></div>' +
'</needs-query-by-var-bindings>';
'</needs-query-by-ref-bindings>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
@ -504,9 +522,10 @@ export function main() {
it('should support dynamically inserted directives',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-binding #q>' +
'<div *ngFor="#item of list" [text]="item" #textLabel="textDir"></div>' +
'</needs-query-by-var-binding>';
var template =
'<needs-query-by-ref-binding #q>' +
'<div *ngFor="let item of list" [text]="item" #textLabel="textDir"></div>' +
'</needs-query-by-ref-binding>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
@ -529,11 +548,11 @@ export function main() {
it('should contain all the elements in the light dom with the given var binding',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query-by-var-binding #q>' +
'<div template="ngFor: #item of list">' +
var template = '<needs-query-by-ref-binding #q>' +
'<div template="ngFor: let item of list">' +
'<div #textLabel>{{item}}</div>' +
'</div>' +
'</needs-query-by-var-binding>';
'</needs-query-by-ref-binding>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
@ -570,7 +589,7 @@ export function main() {
it('should support querying the view by using a view query',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-view-query-by-var-binding #q></needs-view-query-by-var-binding>';
var template = '<needs-view-query-by-ref-binding #q></needs-view-query-by-ref-binding>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
@ -859,7 +878,7 @@ class InertDirective {
@Component({
selector: 'needs-query',
directives: [NgFor, TextDirective],
template: '<div text="ignoreme"></div><b *ngFor="var dir of query">{{dir.text}}|</b>'
template: '<div text="ignoreme"></div><b *ngFor="let dir of query">{{dir.text}}|</b>'
})
@Injectable()
class NeedsQuery {
@ -878,7 +897,7 @@ class NeedsFourQueries {
@Component({
selector: 'needs-query-desc',
directives: [NgFor],
template: '<div *ngFor="var dir of query">{{dir.text}}|</div>'
template: '<div *ngFor="let dir of query">{{dir.text}}|</div>'
})
@Injectable()
class NeedsQueryDesc {
@ -888,7 +907,7 @@ class NeedsQueryDesc {
}
}
@Component({selector: 'needs-query-by-var-binding', directives: [], template: '<ng-content>'})
@Component({selector: 'needs-query-by-ref-binding', directives: [], template: '<ng-content>'})
@Injectable()
class NeedsQueryByLabel {
query: QueryList<any>;
@ -898,7 +917,7 @@ class NeedsQueryByLabel {
}
@Component({
selector: 'needs-view-query-by-var-binding',
selector: 'needs-view-query-by-ref-binding',
directives: [],
template: '<div #textLabel>text</div>'
})
@ -908,7 +927,7 @@ class NeedsViewQueryByLabel {
constructor(@ViewQuery("textLabel") query: QueryList<any>) { this.query = query; }
}
@Component({selector: 'needs-query-by-var-bindings', directives: [], template: '<ng-content>'})
@Component({selector: 'needs-query-by-ref-bindings', directives: [], template: '<ng-content>'})
@Injectable()
class NeedsQueryByTwoLabels {
query: QueryList<any>;
@ -920,7 +939,7 @@ class NeedsQueryByTwoLabels {
@Component({
selector: 'needs-query-and-project',
directives: [NgFor],
template: '<div *ngFor="var dir of query">{{dir.text}}|</div><ng-content></ng-content>'
template: '<div *ngFor="let dir of query">{{dir.text}}|</div><ng-content></ng-content>'
})
@Injectable()
class NeedsQueryAndProject {
@ -975,7 +994,7 @@ class NeedsViewQueryNestedIf {
selector: 'needs-view-query-order',
directives: [NgFor, TextDirective, InertDirective],
template: '<div text="1"></div>' +
'<div *ngFor="var i of list" [text]="i"></div>' +
'<div *ngFor="let i of list" [text]="i"></div>' +
'<div text="4"></div>'
})
@Injectable()
@ -992,7 +1011,7 @@ class NeedsViewQueryOrder {
selector: 'needs-view-query-order-with-p',
directives: [NgFor, TextDirective, InertDirective],
template: '<div dir><div text="1"></div>' +
'<div *ngFor="var i of list" [text]="i"></div>' +
'<div *ngFor="let i of list" [text]="i"></div>' +
'<div text="4"></div></div>'
})
@Injectable()
@ -1005,7 +1024,7 @@ class NeedsViewQueryOrderWithParent {
}
}
@Component({selector: 'needs-tpl', template: '<template var-x="shadow"></template>'})
@Component({selector: 'needs-tpl', template: '<template let-x="shadow"></template>'})
class NeedsTpl {
viewQuery: QueryList<TemplateRef>;
query: QueryList<TemplateRef>;
@ -1016,6 +1035,13 @@ class NeedsTpl {
}
}
@Component({selector: 'needs-named-tpl', template: '<template #tpl let-x="shadow"></template>'})
class NeedsNamedTpl {
@ViewChild('tpl') viewTpl: TemplateRef;
@ContentChild('tpl') contentTpl: TemplateRef;
constructor(public vc: ViewContainerRef) {}
}
@Component({selector: 'needs-content-children-read', template: ''})
class NeedsContentChildrenWithRead {
@ContentChildren('q', {read: TextDirective}) textDirChildren: QueryList<TextDirective>;
@ -1076,6 +1102,7 @@ class NeedsViewContainerWithRead {
NeedsViewChild,
NeedsContentChild,
NeedsTpl,
NeedsNamedTpl,
TextDirective,
InertDirective,
NgIf,

1
modules/angular2/test/platform/browser/bootstrap_spec.ts
View File

@ -92,6 +92,7 @@ class _ArrayLogger {
class DummyConsole implements Console {
log(message) {}
warn(message) {}
}
export function main() {

1
modules/angular2/test/public_api_spec.ts
View File

@ -116,6 +116,7 @@ var NG_COMPILER = [
"TEMPLATE_TRANSFORMS",
"TextAst",
"VariableAst",
"ReferenceAst",
"XHR",
"templateVisitAll",
"CompileDiDependencyMetadata",

1
modules/angular2/test/router/integration/bootstrap_spec.ts
View File

@ -43,6 +43,7 @@ import {MockApplicationRef} from 'angular2/src/mock/mock_application_ref';
class DummyConsole implements Console {
log(message) {}
warn(message) {}
}
export function main() {

1
modules/angular2/test/router/route_config/route_config_spec.ts
View File

@ -35,6 +35,7 @@ class _ArrayLogger {
class DummyConsole implements Console {
log(message) {}
warn(message) {}
}
export function main() {

6
modules/benchmarks/src/costs/index.ts
View File

@ -63,15 +63,15 @@ class DynamicDummy {
directives: [NgIf, NgFor, DummyComponent, DummyDirective, DynamicDummy],
template: `
<div *ngIf="testingPlainComponents">
<dummy *ngFor="#i of list"></dummy>
<dummy *ngFor="let i of list"></dummy>
</div>
<div *ngIf="testingWithDirectives">
<dummy dummy-decorator *ngFor="#i of list"></dummy>
<dummy dummy-decorator *ngFor="let i of list"></dummy>
</div>
<div *ngIf="testingDynamicComponents">
<dynamic-dummy *ngFor="#i of list"></dynamic-dummy>
<dynamic-dummy *ngFor="let i of list"></dynamic-dummy>
</div>
`
})

12
modules/benchmarks/src/largetable/largetable_benchmark.ts
View File

@ -214,22 +214,22 @@ class CellData {
template: `
<table [ngSwitch]="benchmarkType">
<tbody template="ngSwitchWhen 'interpolation'">
<tr template="ngFor #row of data">
<td template="ngFor #column of row">
<tr template="ngFor let row of data">
<td template="ngFor let column of row">
{{column.i}}:{{column.j}}|
</td>
</tr>
</tbody>
<tbody template="ngSwitchWhen 'interpolationAttr'">
<tr template="ngFor #row of data">
<td template="ngFor #column of row" attr.i="{{column.i}}" attr.j="{{column.j}}">
<tr template="ngFor let row of data">
<td template="ngFor let column of row" attr.i="{{column.i}}" attr.j="{{column.j}}">
i,j attrs
</td>
</tr>
</tbody>
<tbody template="ngSwitchWhen 'interpolationFn'">
<tr template="ngFor #row of data">
<td template="ngFor #column of row">
<tr template="ngFor let row of data">
<td template="ngFor let column of row">
{{column.iFn()}}:{{column.jFn()}}|
</td>
</tr>

2
modules/benchmarks/src/naive_infinite_scroll/app.ts
View File

@ -19,7 +19,7 @@ import {Component, Directive} from 'angular2/core';
</div>
<div template="ngIf scrollAreas.length > 0">
<p>Following tables are only here to add weight to the UI:</p>
<scroll-area template="ngFor #scrollArea of scrollAreas"></scroll-area>
<scroll-area template="ngFor let scrollArea of scrollAreas"></scroll-area>
</div>
</div>`
})

2
modules/benchmarks/src/naive_infinite_scroll/cells.ts
View File

@ -55,7 +55,7 @@ export class Stage {
directives: [NgFor],
template: `
<div [style.width.px]="cellWidth">
<button template="ngFor #stage of stages"
<button template="ngFor let stage of stages"
[disabled]="stage.isDisabled"
[style.background-color]="stage.backgroundColor"
on-click="setStage(stage)">

2
modules/benchmarks/src/naive_infinite_scroll/scroll_area.ts
View File

@ -28,7 +28,7 @@ import {NgFor} from 'angular2/common';
<div id="padding"></div>
<div id="inner">
<scroll-item
template="ngFor #item of visibleItems"
template="ngFor let item of visibleItems"
[offering]="item">
</scroll-item>
</div>

2
modules/playground/src/http/http_comp.ts
View File

@ -7,7 +7,7 @@ import 'rxjs/add/operator/map';
template: `
<h1>people</h1>
<ul class="people">
<li *ngFor="#person of people">
<li *ngFor="let person of people">
hello, {{person['name']}}
</li>
</ul>

2
modules/playground/src/jsonp/jsonp_comp.ts
View File

@ -7,7 +7,7 @@ import {ObservableWrapper} from 'angular2/src/facade/async';
template: `
<h1>people</h1>
<ul class="people">
<li *ngFor="#person of people">
<li *ngFor="let person of people">
hello, {{person['name']}}
</li>
</ul>

2
modules/playground/src/model_driven_forms/index.ts
View File

@ -102,7 +102,7 @@ class ShowError {
<p>
<label for="country">Country</label>
<select id="country" ngControl="country">
<option *ngFor="#c of countries" [value]="c">{{c}}</option>
<option *ngFor="let c of countries" [value]="c">{{c}}</option>
</select>
</p>

4
modules/playground/src/order_management/index.ts
View File

@ -82,7 +82,7 @@ class DataService {
selector: 'order-list-cmp',
template: `
<h1>Orders</h1>
<div *ngFor="#order of orders" [class.warning]="order.total > order.limit">
<div *ngFor="let order of orders" [class.warning]="order.total > order.limit">
<div>
<label>Customer name:</label>
{{order.customerName}}
@ -173,7 +173,7 @@ class OrderItemComponent {
<h2>Items</h2>
<button (click)="addItem()">Add Item</button>
<order-item-cmp *ngFor="#item of order.items" [item]="item" (delete)="deleteItem(item)"></order-item-cmp>
<order-item-cmp *ngFor="let item of order.items" [item]="item" (delete)="deleteItem(item)"></order-item-cmp>
</div>
`,
directives: [FORM_DIRECTIVES, OrderItemComponent, NgFor, NgIf]

2
modules/playground/src/person_management/index.ts
View File

@ -161,7 +161,7 @@ class PersonsDetailComponent {
<h1>FullName Demo</h1>
<div>
<ul>
<li *ngFor="#person of persons">
<li *ngFor="let person of persons">
<label (click)="select(person)">{{person.fullName}}</label>
</li>
</ul>

2
modules/playground/src/routing/drafts.html
View File

@ -2,7 +2,7 @@
<h2 class="page-title">Drafts</h2>
<ol class="inbox-list">
<li *ngFor="#item of items" class="inbox-item-record">
<li *ngFor="let item of items" class="inbox-item-record">
<a id="item-{{ item.id }}"
[routerLink]="['/DetailPage', {'id':item.id}]">
{{ item.subject }}</a>

2
modules/playground/src/routing/inbox.html
View File

@ -2,7 +2,7 @@
<h2 class="page-title">Inbox</h2>
<ol class="inbox-list">
<li *ngFor="#item of items" class="inbox-item-record">
<li *ngFor="let item of items" class="inbox-item-record">
<a id="item-{{ item.id }}"
[routerLink]="['/DetailPage', {'id':item.id}]">{{ item.subject }}</a>
</li>

2
modules/playground/src/template_driven_forms/index.ts
View File

@ -122,7 +122,7 @@ class ShowError {
<p>
<label for="country">Country</label>
<select id="country" ngControl="country" [(ngModel)]="model.country">
<option *ngFor="#c of countries" [value]="c">{{c}}</option>
<option *ngFor="let c of countries" [value]="c">{{c}}</option>
</select>
</p>

2
modules/playground/src/todo/todo.html
View File

@ -18,7 +18,7 @@
<ul id="todo-list">
<li *ngFor="#todo of todoStore.list">
<li *ngFor="let todo of todoStore.list">
<div class="view"
[class.hidden]="todoEdit == todo">

2
modules/playground/src/web_workers/images/image_demo.html
View File

@ -7,7 +7,7 @@
</nav>
<section id="main" class="container">
<div class="row">
<div *ngFor="#image of images" class="col s12 m2">
<div *ngFor="let image of images" class="col s12 m2">
<div class="card">
<div class="card-image">
<img [src]="image.src" [class.grey]="image.filtering"/>

2
modules/playground/src/web_workers/todo/todo.html
View File

@ -17,7 +17,7 @@
<ul id="todo-list">
<li *ngFor="#todo of todoStore.list" [class.hidden]="hideActive && !todo.completed || hideCompleted && todo.completed">
<li *ngFor="let todo of todoStore.list" [class.hidden]="hideActive && !todo.completed || hideCompleted && todo.completed">
<div class="view"
[class.hidden]="todoEdit == todo">

2
modules/playground/src/zippy_component/index.ts
View File

@ -9,7 +9,7 @@ import {Zippy} from './zippy';
This is some content.
</zippy>
<ul>
<li *ngFor="var log of logs">{{log}}</li>
<li *ngFor="let log of logs">{{log}}</li>
</ul>
`,
directives: [Zippy]

2
modules_dart/angular2_testing/test/angular2_testing_test.dart
View File

@ -36,7 +36,7 @@ class ExternalTemplateComponent {
class MyToken {}
const TEMPLATE =
'<div><copy-me template=\'ngFor #item of items\'>{{item.toString()}};</copy-me></div>';
'<div><copy-me template=\'ngFor let item of items\'>{{item.toString()}};</copy-me></div>';
void main() {
initAngularTests();

2
modules_dart/transform/lib/src/transform/common/ng_compiler.dart
View File

@ -2,6 +2,7 @@ library angular2.transform.template_compiler.ng_compiler;
import 'package:angular2/src/compiler/config.dart';
import 'package:angular2/src/compiler/view_compiler/view_compiler.dart';
import 'package:angular2/src/core/console.dart';
import 'package:angular2/src/compiler/html_parser.dart';
import 'package:angular2/src/compiler/style_compiler.dart';
import 'package:angular2/src/compiler/offline_compiler.dart';
@ -31,6 +32,7 @@ OfflineCompiler createTemplateCompiler(AssetReader reader,
parser,
new DomElementSchemaRegistry(),
_htmlParser,
new Console(),
[new RouterLinkTransform(parser)]);
return new OfflineCompiler(

11
tools/public_api_guard/public_api_spec.ts
View File

@ -848,15 +848,14 @@ const COMPILER = [
'BoundTextAst.constructor(value:AST, ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'BoundTextAst.visit(visitor:TemplateAstVisitor, context:any):any',
'DirectiveAst',
'DirectiveAst.constructor(directive:CompileDirectiveMetadata, inputs:BoundDirectivePropertyAst[], hostProperties:BoundElementPropertyAst[], hostEvents:BoundEventAst[], exportAsVars:VariableAst[], sourceSpan:ParseSourceSpan)',
'DirectiveAst.constructor(directive:CompileDirectiveMetadata, inputs:BoundDirectivePropertyAst[], hostProperties:BoundElementPropertyAst[], hostEvents:BoundEventAst[], sourceSpan:ParseSourceSpan)',
'DirectiveAst.visit(visitor:TemplateAstVisitor, context:any):any',
'ElementAst',
'ElementAst.constructor(name:string, attrs:AttrAst[], inputs:BoundElementPropertyAst[], outputs:BoundEventAst[], exportAsVars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'ElementAst.constructor(name:string, attrs:AttrAst[], inputs:BoundElementPropertyAst[], outputs:BoundEventAst[], references:ReferenceAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'ElementAst.getComponent():CompileDirectiveMetadata',
'ElementAst.isBound():boolean',
'ElementAst.visit(visitor:TemplateAstVisitor, context:any):any',
'EmbeddedTemplateAst',
'EmbeddedTemplateAst.constructor(attrs:AttrAst[], outputs:BoundEventAst[], vars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'EmbeddedTemplateAst.constructor(attrs:AttrAst[], outputs:BoundEventAst[], references:ReferenceAst[], variables:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'EmbeddedTemplateAst.visit(visitor:TemplateAstVisitor, context:any):any',
'NgContentAst',
'NgContentAst.constructor(index:number, ngContentIndex:number, sourceSpan:ParseSourceSpan)',
@ -890,6 +889,10 @@ const COMPILER = [
'VariableAst',
'VariableAst.constructor(name:string, value:string, sourceSpan:ParseSourceSpan)',
'VariableAst.visit(visitor:TemplateAstVisitor, context:any):any',
'ReferenceAst',
'ReferenceAst.constructor(name:string, value:CompileTokenMetadata, sourceSpan:ParseSourceSpan)',
'ReferenceAst.visit(visitor:TemplateAstVisitor, context:any):any',
'TemplateAstVisitor.visitReference(ast:ReferenceAst, context:any):any',
'XHR',
'XHR.get(url:string):Promise<string>',
'const COMPILER_PROVIDERS:Array<Type|Provider|any[]>',