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

chore(core): remove @View annotation 

Closes #7495
This commit is contained in:
Brian Ford 2016-03-08 13:36:48 -08:00
parent 095db673c5
commit f9fb72fb0e
85 changed files with 588 additions and 599 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
TOOLS_JS.md
View File

@ -117,7 +117,7 @@ speed things up is to use plain class fields in your expressions and avoid any
kinds of computation. Example:
```typescript
@View({
@Component({
template: '<button [enabled]="isEnabled">{{title}}</button>'
})
class FancyButton {

22
modules/angular2/docs/core/02_directives.md
View File

@ -112,9 +112,7 @@ Example of a component:
'title', | - title mapped to component title
'open' | - open attribute mapped to component's open property
], |
}) |
@View({ | View annotation
templateUrl: 'pane.html' | - URL of template HTML
templateUrl: 'pane.html' | URL of template HTML
}) |
class Pane { | Component controller class
title:string; | - title property
@ -227,11 +225,9 @@ class MyService {} | Assume a service which needs to be inject
|
@Component({ | Assume a top level application component which
selector: 'my-app', | configures the services to be injected.
viewBindings: [MyService] |
}) |
@View({ | Assume we have a template that needs to be
templateUrl: 'my_app.html', | configured with directives to be injected.
directives: [House] |
viewBindings: [MyService], |
templateUrl: 'my_app.html', | Assume we have a template that needs to be
directives: [House] | configured with directives to be injected.
}) |
class MyApp {} |
|
@ -273,8 +269,6 @@ Here is an example of the kinds of injections which can be achieved:
```
@Component({ |
selector: 'my-app' |
}) |
@View({ |
templateUrl: 'my_app.html', |
directives: [Form, FieldSet, |
Field, Primary] |
@ -329,8 +323,6 @@ Shadow DOM provides an encapsulation for components, so as a general rule it doe
```
@Component({
selector: '[kid]'
})
@View({
templateUrl: 'kid.html',
directives: []
})
@ -347,8 +339,6 @@ class Kid {
@Component({
selector: '[dad]'
})
@View({
templateUrl: 'dad.html',
directives: [Kid]
})
@ -361,9 +351,7 @@ class Dad {
@Component({
selector: '[grandpa]',
viewBindings: []
})
@View({
viewBindings: [],
templateUrl: 'grandpa.html',
directives: [Dad]
})

4
modules/angular2/docs/di/di_advanced.md
View File

@ -179,9 +179,7 @@ Both `MyComponent` and `MyDirective` are created on the same element.
],
viewBindings: [
bind('viewService').toValue('View_MyComponentService')
]
})
@View({
],
template: `<needs-view-service></needs-view-service>`,
directives: [NeedsViewService]
})

2
modules/angular2/src/common/common_directives.ts
View File

@ -9,7 +9,7 @@ import {CORE_DIRECTIVES} from './directives';
* NgModel).
*
* This collection can be used to quickly enumerate all the built-in directives in the `directives`
* property of the `@Component` or `@View` decorators.
* property of the `@Component` decorator.
*
* ### Example
*

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

@ -11,7 +11,7 @@ import {NgPlural, NgPluralCase} from './ng_plural';
* application.
*
* This collection can be used to quickly enumerate all the built-in directives in the `directives`
* property of the `@View` annotation.
* property of the `@Component` annotation.
*
* ### Example ([live demo](http://plnkr.co/edit/yakGwpCdUkg0qfzX5m8g?p=preview))
*

4
modules/angular2/src/common/directives/ng_switch.ts
View File

@ -32,8 +32,8 @@ export class SwitchView {
* ### Example ([live demo](http://plnkr.co/edit/DQMTII95CbuqWrl3lYAs?p=preview))
*
* ```typescript
* @Component({selector: 'app'})
* @View({
* @Component({
* selector: 'app',
* template: `
* <p>Value = {{value}}</p>
* <button (click)="inc()">Increment</button>

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

@ -50,7 +50,7 @@ export {ControlValueAccessor} from './directives/control_value_accessor';
/**
*
* A list of all the form directives used as part of a `@View` annotation.
* A list of all the form directives used as part of a `@Component` annotation.
*
* This is a shorthand for importing them each individually.
*

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

@ -33,8 +33,6 @@ const controlGroupProvider =
* @Component({
* selector: 'my-app',
* directives: [FORM_DIRECTIVES],
* })
* @View({
* template: `
* <div>
* <h2>Angular2 Control &amp; ControlGroup Example</h2>

2
modules/angular2/src/common/pipes/common_pipes.ts
View File

@ -20,7 +20,7 @@ import {CONST_EXPR} from 'angular2/src/facade/lang';
* application.
*
* This collection can be used to quickly enumerate all the built-in pipes in the `pipes`
* property of the `@Component` or `@View` decorators.
* property of the `@Component` decorator.
*/
export const COMMON_PIPES = CONST_EXPR([
AsyncPipe,

5
modules/angular2/src/core/linker/view_resolver.ts
View File

@ -45,7 +45,7 @@ export class ViewResolver {
if (isPresent(compMeta)) {
if (isBlank(compMeta.template) && isBlank(compMeta.templateUrl) && isBlank(viewMeta)) {
throw new BaseException(
`Component '${stringify(component)}' must have either 'template', 'templateUrl', or '@View' set.`);
`Component '${stringify(component)}' must have either 'template' or 'templateUrl' set.`);
} else if (isPresent(compMeta.template) && isPresent(viewMeta)) {
this._throwMixingViewAndComponent("template", component);
@ -84,7 +84,8 @@ export class ViewResolver {
}
} else {
if (isBlank(viewMeta)) {
throw new BaseException(`No View decorator found on component '${stringify(component)}'`);
throw new BaseException(
`Could not compile '${stringify(component)}' because it is not a component.`);
} else {
return viewMeta;
}

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

@ -254,7 +254,6 @@ export interface ComponentFactory {
* import {Component, View} from "angular2/core";
*
* @Component({...})
* @View({...})
* class MyComponent {
* constructor() {
* ...
@ -481,8 +480,7 @@ export interface HostListenerFactory {
/**
* Declare reusable UI building blocks for an application.
*
* Each Angular component requires a single `@Component` and at least one `@View` annotation. The
* `@Component`
* Each Angular component requires a single `@Component` annotation. The `@Component`
* annotation specifies when a component is instantiated, and which properties and hostListeners it
* binds to.
*
@ -493,8 +491,6 @@ export interface HostListenerFactory {
*
* All template expressions and statements are then evaluated against the component instance.
*
* For details on the `@View` annotation, see {@link ViewMetadata}.
*
* ## Lifecycle hooks
*
* When the component class implements some {@link angular2/lifecycle_hooks} the callbacks are
@ -918,8 +914,7 @@ export var Directive: DirectiveFactory = <DirectiveFactory>makeDecorator(Directi
* }
* ```
*/
export var View: ViewFactory =
<ViewFactory>makeDecorator(ViewMetadata, (fn: any) => fn.View = View);
var View: ViewFactory = <ViewFactory>makeDecorator(ViewMetadata, (fn: any) => fn.View = View);
/**
* Specifies that a constant attribute value should be injected.
@ -1154,8 +1149,8 @@ export var ViewChild: ViewChildFactory = makePropDecorator(ViewChildMetadata);
* ### Example ([live demo](http://plnkr.co/edit/eNsFHDf7YjyM6IzKxM1j?p=preview))
*
* ```javascript
* @Component({...})
* @View({
* @Component({
* ...,
* template: `
* <item> a </item>
* <item> b </item>

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

@ -242,8 +242,8 @@ export class ContentChildMetadata extends QueryMetadata {
* ### Example ([live demo](http://plnkr.co/edit/eNsFHDf7YjyM6IzKxM1j?p=preview))
*
* ```javascript
* @Component({...})
* @View({
* @Component({
* ...,
* template: `
* <item> a </item>
* <item> b </item>

6
modules/angular2/src/router/instruction.ts
View File

@ -59,8 +59,10 @@ export class RouteParams {
* ])
* class AppCmp {}
*
* @Component({...})
* @View({ template: 'user: {{isAdmin}}' })
* @Component({
* ...,
* template: 'user: {{isAdmin}}'
* })
* class UserCmp {
* string: isAdmin;
* constructor(data: RouteData) {

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

@ -15,7 +15,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {ListWrapper, StringMapWrapper, SetWrapper} from 'angular2/src/facade/collection';
import {Component, View, provide} from 'angular2/core';
import {Component, provide} from 'angular2/core';
import {NgFor} from 'angular2/common';
import {NgClass} from 'angular2/src/common/directives/ng_class';
@ -528,8 +528,7 @@ export function main() {
})
}
@Component({selector: 'test-cmp'})
@View({directives: [NgClass, NgFor]})
@Component({selector: 'test-cmp', directives: [NgClass, NgFor], template: ''})
class TestComponent {
condition: boolean = true;
items: any[];

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

@ -14,7 +14,7 @@ import {
} from 'angular2/testing_internal';
import {ListWrapper} from 'angular2/src/facade/collection';
import {Component, View, TemplateRef, ContentChild} from 'angular2/core';
import {Component, TemplateRef, ContentChild} from 'angular2/core';
import {NgFor} from 'angular2/src/common/directives/ng_for';
import {NgIf} from 'angular2/src/common/directives/ng_if';
import {By} from 'angular2/platform/common_dom';
@ -472,8 +472,7 @@ class Foo {
toString() { return 'foo'; }
}
@Component({selector: 'test-cmp'})
@View({directives: [NgFor, NgIf]})
@Component({selector: 'test-cmp', directives: [NgFor, NgIf], template: ''})
class TestComponent {
@ContentChild(TemplateRef) contentTpl: TemplateRef;
items: any;
@ -482,8 +481,7 @@ class TestComponent {
trackByIndex(index: number, item: any): number { return index; }
}
@Component({selector: 'outer-cmp'})
@View({directives: [TestComponent]})
@Component({selector: 'outer-cmp', directives: [TestComponent], template: ''})
class ComponentUsingTestComponent {
items: any;
constructor() { this.items = [1, 2]; }

5
modules/angular2/test/common/directives/ng_if_spec.ts
View File

@ -14,7 +14,7 @@ import {
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {IS_DART} from 'angular2/src/facade/lang';
@ -224,8 +224,7 @@ export function main() {
});
}
@Component({selector: 'test-cmp'})
@View({directives: [NgIf]})
@Component({selector: 'test-cmp', directives: [NgIf], template: ''})
class TestComponent {
booleanCondition: boolean;
nestedBooleanCondition: boolean;

5
modules/angular2/test/common/directives/ng_plural_spec.ts
View File

@ -13,7 +13,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {Component, View, Injectable, provide} from 'angular2/core';
import {Component, Injectable, provide} from 'angular2/core';
import {NgPlural, NgPluralCase, NgLocalization} from 'angular2/common';
export function main() {
@ -128,8 +128,7 @@ export class TestLocalizationMap extends NgLocalization {
}
@Component({selector: 'test-cmp'})
@View({directives: [NgPlural, NgPluralCase]})
@Component({selector: 'test-cmp', directives: [NgPlural, NgPluralCase], template: ''})
class TestComponent {
switchValue: number;

5
modules/angular2/test/common/directives/ng_style_spec.ts
View File

@ -16,7 +16,7 @@ import {
import {StringMapWrapper} from 'angular2/src/facade/collection';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {NgStyle} from 'angular2/src/common/directives/ng_style';
@ -137,8 +137,7 @@ export function main() {
})
}
@Component({selector: 'test-cmp'})
@View({directives: [NgStyle]})
@Component({selector: 'test-cmp', directives: [NgStyle], template: ''})
class TestComponent {
expr;
}

6
modules/angular2/test/common/directives/ng_switch_spec.ts
View File

@ -12,7 +12,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {NgSwitch, NgSwitchWhen, NgSwitchDefault} from 'angular2/src/common/directives/ng_switch';
@ -145,8 +145,8 @@ export function main() {
});
}
@Component({selector: 'test-cmp'})
@View({directives: [NgSwitch, NgSwitchWhen, NgSwitchDefault]})
@Component(
{selector: 'test-cmp', directives: [NgSwitch, NgSwitchWhen, NgSwitchDefault], template: ''})
class TestComponent {
switchValue: any;
when1: any;

5
modules/angular2/test/common/directives/non_bindable_spec.ts
View File

@ -12,7 +12,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {Component, Directive, View} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
import {ElementRef} from 'angular2/src/core/linker/element_ref';
export function main() {
@ -65,8 +65,7 @@ class TestDirective {
constructor(el: ElementRef) { DOM.addClass(el.nativeElement, 'compiled'); }
}
@Component({selector: 'test-cmp'})
@View({directives: [TestDirective]})
@Component({selector: 'test-cmp', directives: [TestDirective], template: ''})
class TestComponent {
text: string;
constructor() { this.text = 'foo'; }

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

@ -1,4 +1,4 @@
import {Component, Directive, View, Output, EventEmitter} from 'angular2/core';
import {Component, Directive, Output, EventEmitter} from 'angular2/core';
import {
ComponentFixture,
afterEach,

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

@ -13,7 +13,7 @@ import {
beforeEachProviders
} from 'angular2/testing_internal';
import {Component, View, provide} from 'angular2/core';
import {Component, provide} from 'angular2/core';
import {PromiseWrapper} from 'angular2/src/facade/async';
import {SpyTemplateCompiler} from './spies';
import {TemplateCompiler} from 'angular2/src/compiler/compiler';
@ -52,7 +52,6 @@ export function main() {
});
}
@Component({selector: 'some-comp'})
@View({template: ''})
@Component({selector: 'some-comp', template: ''})
class SomeComponent {
}

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

@ -18,7 +18,6 @@ import {RuntimeMetadataResolver} from 'angular2/src/compiler/runtime_metadata';
import {LifecycleHooks, LIFECYCLE_HOOKS_VALUES} from 'angular2/src/core/linker/interfaces';
import {
Component,
View,
Directive,
ViewEncapsulation,
ChangeDetectionStrategy,
@ -125,9 +124,7 @@ class ComponentWithoutModuleId {
},
exportAs: 'someExportAs',
moduleId: 'someModuleId',
changeDetection: ChangeDetectionStrategy.CheckAlways
})
@View({
changeDetection: ChangeDetectionStrategy.CheckAlways,
template: 'someTemplate',
templateUrl: 'someTemplateUrl',
encapsulation: ViewEncapsulation.Emulated,

48
modules/angular2/test/compiler/template_compiler_spec.ts
View File

@ -37,7 +37,7 @@ import {AppView, AppProtoView} from 'angular2/src/core/linker/view';
import {AppElement} from 'angular2/src/core/linker/element';
import {Locals, ChangeDetectorGenConfig} from 'angular2/src/core/change_detection/change_detection';
import {Component, View, Directive, provide, RenderComponentType} from 'angular2/core';
import {Component, Directive, provide, RenderComponentType} from 'angular2/core';
import {TEST_PROVIDERS} from './test_bindings';
import {
@ -338,9 +338,7 @@ export class UpperCasePipe implements PipeTransform {
selector: 'comp-a',
host: {'[title]': '\'someHostValue\''},
moduleId: THIS_MODULE_ID,
exportAs: 'someExportAs'
})
@View({
exportAs: 'someExportAs',
template: '<a [href]="\'someCtxValue\' | uppercase"></a>',
styles: ['div {color: red}'],
encapsulation: ViewEncapsulation.None,
@ -349,8 +347,9 @@ export class UpperCasePipe implements PipeTransform {
export class CompWithBindingsAndStylesAndPipes {
}
@Component({selector: 'tree', moduleId: THIS_MODULE_ID})
@View({
@Component({
selector: 'tree',
moduleId: THIS_MODULE_ID,
template: '<template><tree></tree></template>',
directives: [TreeComp],
encapsulation: ViewEncapsulation.None
@ -358,8 +357,9 @@ export class CompWithBindingsAndStylesAndPipes {
export class TreeComp {
}
@Component({selector: 'comp-wit-dup-tpl', moduleId: THIS_MODULE_ID})
@View({
@Component({
selector: 'comp-wit-dup-tpl',
moduleId: THIS_MODULE_ID,
template: '<tree></tree>',
directives: [TreeComp, TreeComp],
encapsulation: ViewEncapsulation.None
@ -367,13 +367,18 @@ export class TreeComp {
export class CompWithDupDirectives {
}
@Component({selector: 'comp-url', moduleId: THIS_MODULE_ID})
@View({templateUrl: 'compUrl.html', encapsulation: ViewEncapsulation.None})
@Component({
selector: 'comp-url',
moduleId: THIS_MODULE_ID,
templateUrl: 'compUrl.html',
encapsulation: ViewEncapsulation.None
})
export class CompWithTemplateUrl {
}
@Component({selector: 'comp-tpl', moduleId: THIS_MODULE_ID})
@View({
@Component({
selector: 'comp-tpl',
moduleId: THIS_MODULE_ID,
template: '<template><a [href]="\'someEmbeddedValue\'"></a></template>',
encapsulation: ViewEncapsulation.None
})
@ -382,18 +387,22 @@ export class CompWithEmbeddedTemplate {
@Directive({selector: 'plain'})
@View({template: ''})
export class NonComponent {
}
@Component({selector: 'comp2', moduleId: THIS_MODULE_ID})
@View({template: '<b></b>', encapsulation: ViewEncapsulation.None})
@Component({
selector: 'comp2',
moduleId: THIS_MODULE_ID,
template: '<b></b>',
encapsulation: ViewEncapsulation.None
})
export class Comp2 {
}
@Component({selector: 'comp1', moduleId: THIS_MODULE_ID})
@View({
@Component({
selector: 'comp1',
moduleId: THIS_MODULE_ID,
template: '<a></a>, <comp2></comp2>',
encapsulation: ViewEncapsulation.None,
directives: [Comp2]
@ -401,8 +410,9 @@ export class Comp2 {
export class Comp1 {
}
@Component({selector: 'comp-with-2nested', moduleId: THIS_MODULE_ID})
@View({
@Component({
selector: 'comp-with-2nested',
moduleId: THIS_MODULE_ID,
template: '<comp1></comp1>, <comp2></comp2>',
encapsulation: ViewEncapsulation.None,
directives: [Comp1, Comp2]

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

@ -22,7 +22,7 @@ import {Injectable} from 'angular2/core';
import {NgFor, NgIf} from 'angular2/common';
import {By} from 'angular2/platform/common_dom';
import {Directive, Component, View, Input} from 'angular2/src/core/metadata';
import {Directive, Component, Input} from 'angular2/src/core/metadata';
@Injectable()
class Logger {
@ -43,8 +43,8 @@ class MessageDir {
set message(newMessage) { this.logger.add(newMessage); }
}
@Component({selector: 'child-comp'})
@View({
@Component({
selector: 'child-comp',
template: `<div class="child" message="child">
<span class="childnested" message="nestedchild">Child</span>
</div>
@ -58,8 +58,9 @@ class ChildComp {
constructor() { this.childBinding = 'Original'; }
}
@Component({selector: 'parent-comp', viewProviders: [Logger]})
@View({
@Component({
selector: 'parent-comp',
viewProviders: [Logger],
template: `<div class="parent" message="parent">
<span class="parentnested" message="nestedparent">Parent</span>
</div>
@ -81,8 +82,8 @@ class CustomEmitter {
constructor() { this.myevent = new EventEmitter(); }
}
@Component({selector: 'events-comp'})
@View({
@Component({
selector: 'events-comp',
template: `<button (click)="handleClick()"></button>
<custom-emitter (myevent)="handleCustom()"></custom-emitter>`,
directives: [CustomEmitter],
@ -102,8 +103,9 @@ class EventsComp {
handleCustom() { this.customed = true; }
}
@Component({selector: 'cond-content-comp', viewProviders: [Logger]})
@View({
@Component({
selector: 'cond-content-comp',
viewProviders: [Logger],
template: `<div class="child" message="child" *ngIf="myBool"><ng-content></ng-content></div>`,
directives: [NgIf, MessageDir],
})
@ -112,8 +114,9 @@ class ConditionalContentComp {
myBool: boolean = false;
}
@Component({selector: 'conditional-parent-comp', viewProviders: [Logger]})
@View({
@Component({
selector: 'conditional-parent-comp',
viewProviders: [Logger],
template: `<span class="parent" [innerHtml]="parentBinding"></span>
<cond-content-comp class="cond-content-comp-class">
<span class="from-parent"></span>
@ -126,8 +129,9 @@ class ConditionalParentComp {
constructor() { this.parentBinding = 'OriginalParent'; }
}
@Component({selector: 'using-for', viewProviders: [Logger]})
@View({
@Component({
selector: 'using-for',
viewProviders: [Logger],
template: `<span *ngFor="#thing of stuff" [innerHtml]="thing"></span>
<ul message="list">
<li *ngFor="#item of stuff" [innerHtml]="item"></li>

17
modules/angular2/test/core/directive_lifecycle_integration_spec.ts
View File

@ -22,7 +22,7 @@ import {
AfterViewInit,
AfterViewChecked
} from 'angular2/core';
import {Directive, Component, View, ViewMetadata} from 'angular2/src/core/metadata';
import {Directive, Component, ViewMetadata} from 'angular2/src/core/metadata';
export function main() {
describe('directive lifecycle integration spec', () => {
@ -63,10 +63,14 @@ class LifecycleDir implements DoCheck {
ngDoCheck() { this._log.add("child_ngDoCheck"); }
}
@Component({selector: "[lifecycle]", inputs: ['field']})
@View({template: `<div lifecycle-dir></div>`, directives: [LifecycleDir]})
class LifecycleCmp implements OnChanges, OnInit, DoCheck, AfterContentInit, AfterContentChecked,
AfterViewInit, AfterViewChecked {
@Component({
selector: "[lifecycle]",
inputs: ['field'],
template: `<div lifecycle-dir></div>`,
directives: [LifecycleDir]
})
class LifecycleCmp implements OnChanges,
OnInit, DoCheck, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked {
field;
constructor(private _log: Log) {}
@ -85,7 +89,6 @@ class LifecycleCmp implements OnChanges, OnInit, DoCheck, AfterContentInit, Afte
ngAfterViewChecked() { this._log.add("ngAfterViewChecked"); }
}
@Component({selector: 'my-comp'})
@View({directives: []})
@Component({selector: 'my-comp', directives: []})
class MyComp {
}

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

@ -19,8 +19,7 @@ import {
Directive,
Inject,
Query,
QueryList,
View
QueryList
} from 'angular2/core';
import {NgFor} from 'angular2/common';
import {Type} from 'angular2/src/facade/lang';
@ -39,16 +38,17 @@ export function main() {
});
}
@Component({selector: 'app', viewProviders: [forwardRef(() => Frame)]})
@View({
@Component({
selector: 'app',
viewProviders: [forwardRef(() => Frame)],
template: `<door><lock></lock></door>`,
directives: [forwardRef(() => Door), forwardRef(() => Lock)],
})
class App {
}
@Component({selector: 'lock'})
@View({
@Component({
selector: 'lock',
directives: [NgFor],
template: `{{frame.name}}(<span *ngFor="var lock of locks">{{lock.name}}</span>)`,
})

35
modules/angular2/test/core/linker/dynamic_component_loader_spec.ts
View File

@ -19,7 +19,7 @@ import {
import {OnDestroy} from 'angular2/core';
import {Injector} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {Component, View, ViewMetadata} from 'angular2/src/core/metadata';
import {Component, ViewMetadata} from 'angular2/src/core/metadata';
import {DynamicComponentLoader} from 'angular2/src/core/linker/dynamic_component_loader';
import {ElementRef, ElementRef_} from 'angular2/src/core/linker/element_ref';
import {DOCUMENT} from 'angular2/src/platform/dom/dom_tokens';
@ -369,10 +369,7 @@ function createRootElement(doc: any, name: string): any {
return rootEl;
}
@Component({
selector: 'child-cmp',
})
@View({template: '{{ctxProp}}'})
@Component({selector: 'child-cmp', template: '{{ctxProp}}'})
class ChildComp {
ctxProp: string;
constructor() { this.ctxProp = 'hello'; }
@ -381,8 +378,11 @@ class ChildComp {
class DynamicallyCreatedComponentService {}
@Component({selector: 'hello-cmp', viewProviders: [DynamicallyCreatedComponentService]})
@View({template: "{{greeting}}"})
@Component({
selector: 'hello-cmp',
viewProviders: [DynamicallyCreatedComponentService],
template: "{{greeting}}"
})
class DynamicallyCreatedCmp implements OnDestroy {
greeting: string;
dynamicallyCreatedComponentService: DynamicallyCreatedComponentService;
@ -396,48 +396,41 @@ class DynamicallyCreatedCmp implements OnDestroy {
ngOnDestroy() { this.destroyed = true; }
}
@Component({selector: 'dummy'})
@View({template: "DynamicallyLoaded;"})
@Component({selector: 'dummy', template: "DynamicallyLoaded;"})
class DynamicallyLoaded {
}
@Component({selector: 'dummy'})
@View({template: "DynamicallyLoaded;"})
@Component({selector: 'dummy', template: "DynamicallyLoaded;"})
class DynamicallyLoadedThrows {
constructor() { throw new BaseException("ThrownInConstructor"); }
}
@Component({selector: 'dummy'})
@View({template: "DynamicallyLoaded2;"})
@Component({selector: 'dummy', template: "DynamicallyLoaded2;"})
class DynamicallyLoaded2 {
}
@Component({selector: 'dummy', host: {'[id]': 'id'}})
@View({template: "DynamicallyLoadedWithHostProps;"})
@Component({selector: 'dummy', host: {'[id]': 'id'}, template: "DynamicallyLoadedWithHostProps;"})
class DynamicallyLoadedWithHostProps {
id: string;
constructor() { this.id = "default"; }
}
@Component({selector: 'dummy'})
@View({template: "dynamic(<ng-content></ng-content>)"})
@Component({selector: 'dummy', template: "dynamic(<ng-content></ng-content>)"})
class DynamicallyLoadedWithNgContent {
id: string;
constructor() { this.id = "default"; }
}
@Component({selector: 'location'})
@View({template: "Location;"})
@Component({selector: 'location', template: "Location;"})
class Location {
elementRef: ElementRef;
constructor(elementRef: ElementRef) { this.elementRef = elementRef; }
}
@Component({selector: 'my-comp'})
@View({directives: []})
@Component({selector: 'my-comp', directives: []})
class MyComp {
ctxBoolProp: boolean;

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

@ -71,7 +71,6 @@ import {
import {
Directive,
Component,
View,
ViewMetadata,
Attribute,
Query,
@ -1358,8 +1357,7 @@ function declareTests() {
try {
tcb.createAsync(ComponentWithoutView);
} catch (e) {
expect(e.message)
.toContain(`must have either 'template', 'templateUrl', or '@View' set.`);
expect(e.message).toContain(`must have either 'template' or 'templateUrl' set.`);
return null;
}
}));
@ -1936,8 +1934,7 @@ class MyService {
constructor() { this.greeting = 'hello'; }
}
@Component({selector: 'simple-imp-cmp'})
@View({template: ''})
@Component({selector: 'simple-imp-cmp', template: ''})
@Injectable()
class SimpleImperativeViewComponent {
done;
@ -1979,9 +1976,12 @@ class DirectiveWithTitleAndHostProperty {
title: string;
}
@Component(
{selector: 'push-cmp', inputs: ['prop'], changeDetection: ChangeDetectionStrategy.OnPush})
@View({template: '{{field}}'})
@Component({
selector: 'push-cmp',
inputs: ['prop'],
changeDetection: ChangeDetectionStrategy.OnPush,
template: '{{field}}'
})
@Injectable()
class PushCmp {
numberOfChecks: number;
@ -1998,9 +1998,9 @@ class PushCmp {
@Component({
selector: 'push-cmp-with-ref',
inputs: ['prop'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
template: '{{field}}'
})
@View({template: '{{field}}'})
@Injectable()
class PushCmpWithRef {
numberOfChecks: number;
@ -2055,8 +2055,7 @@ class PushCmpWithAsyncPipe {
resolve(value) { this.completer.resolve(value); }
}
@Component({selector: 'my-comp'})
@View({directives: []})
@Component({selector: 'my-comp', directives: []})
@Injectable()
class MyComp {
ctxProp: string;
@ -2071,8 +2070,13 @@ class MyComp {
throwError() { throw 'boom'; }
}
@Component({selector: 'child-cmp', inputs: ['dirProp'], viewProviders: [MyService]})
@View({directives: [MyDir], template: '{{ctxProp}}'})
@Component({
selector: 'child-cmp',
inputs: ['dirProp'],
viewProviders: [MyService],
directives: [MyDir],
template: '{{ctxProp}}'
})
@Injectable()
class ChildComp {
ctxProp: string;
@ -2083,15 +2087,13 @@ class ChildComp {
}
}
@Component({selector: 'child-cmp-no-template'})
@View({directives: [], template: ''})
@Component({selector: 'child-cmp-no-template', directives: [], template: ''})
@Injectable()
class ChildCompNoTemplate {
ctxProp: string = 'hello';
}
@Component({selector: 'child-cmp-svc'})
@View({template: '{{ctxProp}}'})
@Component({selector: 'child-cmp-svc', template: '{{ctxProp}}'})
@Injectable()
class ChildCompUsingService {
ctxProp: string;
@ -2105,8 +2107,11 @@ class SomeDirective {
class SomeDirectiveMissingAnnotation {}
@Component({selector: 'cmp-with-host'})
@View({template: '<p>Component with an injected host</p>', directives: [SomeDirective]})
@Component({
selector: 'cmp-with-host',
template: '<p>Component with an injected host</p>',
directives: [SomeDirective]
})
@Injectable()
class CompWithHost {
myHost: SomeDirective;
@ -2283,8 +2288,8 @@ class ToolbarViewContainer {
}
}
@Component({selector: 'toolbar'})
@View({
@Component({
selector: 'toolbar',
template: 'TOOLBAR(<div *ngFor="var part of query" [toolbarVc]="part"></div>)',
directives: [ToolbarViewContainer, NgFor]
})
@ -2321,9 +2326,9 @@ function createInjectableWithLogging(inj: Injector) {
selector: 'component-providing-logging-injectable',
providers: [
new Provider(InjectableService, {useFactory: createInjectableWithLogging, deps: [Injector]})
]
],
template: ''
})
@View({template: ''})
@Injectable()
class ComponentProvidingLoggingInjectable {
created: boolean = false;
@ -2335,8 +2340,11 @@ class ComponentProvidingLoggingInjectable {
class DirectiveProvidingInjectable {
}
@Component({selector: 'directive-providing-injectable', viewProviders: [[InjectableService]]})
@View({template: ''})
@Component({
selector: 'directive-providing-injectable',
viewProviders: [[InjectableService]],
template: ''
})
@Injectable()
class DirectiveProvidingInjectableInView {
}
@ -2344,16 +2352,15 @@ class DirectiveProvidingInjectableInView {
@Component({
selector: 'directive-providing-injectable',
providers: [new Provider(InjectableService, {useValue: 'host'})],
viewProviders: [new Provider(InjectableService, {useValue: 'view'})]
viewProviders: [new Provider(InjectableService, {useValue: 'view'})],
template: ''
})
@View({template: ''})
@Injectable()
class DirectiveProvidingInjectableInHostAndView {
}
@Component({selector: 'directive-consuming-injectable'})
@View({template: ''})
@Component({selector: 'directive-consuming-injectable', template: ''})
@Injectable()
class DirectiveConsumingInjectable {
injectable;
@ -2369,8 +2376,7 @@ class DirectiveContainingDirectiveConsumingAnInjectable {
directive;
}
@Component({selector: 'directive-consuming-injectable-unbounded'})
@View({template: ''})
@Component({selector: 'directive-consuming-injectable-unbounded', template: ''})
@Injectable()
class DirectiveConsumingInjectableUnbounded {
injectable;
@ -2413,9 +2419,7 @@ function createParentBus(peb) {
providers: [
new Provider(EventBus,
{useFactory: createParentBus, deps: [[EventBus, new SkipSelfMetadata()]]})
]
})
@View({
],
directives: [forwardRef(() => ChildConsumingEventBus)],
template: `
<child-consuming-event-bus></child-consuming-event-bus>

95
modules/angular2/test/core/linker/projection_integration_spec.ts
View File

@ -30,7 +30,6 @@ import {
Directive,
ElementRef,
TemplateRef,
View,
ViewContainerRef,
ViewEncapsulation,
ViewMetadata
@ -580,26 +579,28 @@ export function main() {
});
}
@Component({selector: 'main'})
@View({template: '', directives: []})
@Component({selector: 'main', template: '', directives: []})
class MainComp {
text: string = '';
}
@Component({selector: 'other'})
@View({template: '', directives: []})
@Component({selector: 'other', template: '', directives: []})
class OtherComp {
text: string = '';
}
@Component({selector: 'simple', inputs: ['stringProp']})
@View({template: 'SIMPLE(<ng-content></ng-content>)', directives: []})
@Component({
selector: 'simple',
inputs: ['stringProp'],
template: 'SIMPLE(<ng-content></ng-content>)',
directives: []
})
class Simple {
stringProp: string = '';
}
@Component({selector: 'simple-native1'})
@View({
@Component({
selector: 'simple-native1',
template: 'SIMPLE1(<content></content>)',
directives: [],
encapsulation: ViewEncapsulation.Native,
@ -608,8 +609,8 @@ class Simple {
class SimpleNative1 {
}
@Component({selector: 'simple-native2'})
@View({
@Component({
selector: 'simple-native2',
template: 'SIMPLE2(<content></content>)',
directives: [],
encapsulation: ViewEncapsulation.Native,
@ -618,13 +619,12 @@ class SimpleNative1 {
class SimpleNative2 {
}
@Component({selector: 'empty'})
@View({template: '', directives: []})
@Component({selector: 'empty', template: '', directives: []})
class Empty {
}
@Component({selector: 'multiple-content-tags'})
@View({
@Component({
selector: 'multiple-content-tags',
template: '(<ng-content SELECT=".left"></ng-content>, <ng-content></ng-content>)',
directives: []
})
@ -645,16 +645,16 @@ class ProjectDirective {
hide() { this.vc.clear(); }
}
@Component({selector: 'outer-with-indirect-nested'})
@View({
@Component({
selector: 'outer-with-indirect-nested',
template: 'OUTER(<simple><div><ng-content></ng-content></div></simple>)',
directives: [Simple]
})
class OuterWithIndirectNestedComponent {
}
@Component({selector: 'outer'})
@View({
@Component({
selector: 'outer',
template:
'OUTER(<inner><ng-content select=".left" class="left"></ng-content><ng-content></ng-content></inner>)',
directives: [forwardRef(() => InnerComponent)]
@ -662,8 +662,8 @@ class OuterWithIndirectNestedComponent {
class OuterComponent {
}
@Component({selector: 'inner'})
@View({
@Component({
selector: 'inner',
template:
'INNER(<innerinner><ng-content select=".left" class="left"></ng-content><ng-content></ng-content></innerinner>)',
directives: [forwardRef(() => InnerInnerComponent)]
@ -671,16 +671,16 @@ class OuterComponent {
class InnerComponent {
}
@Component({selector: 'innerinner'})
@View({
@Component({
selector: 'innerinner',
template: 'INNERINNER(<ng-content select=".left"></ng-content>,<ng-content></ng-content>)',
directives: []
})
class InnerInnerComponent {
}
@Component({selector: 'conditional-content'})
@View({
@Component({
selector: 'conditional-content',
template:
'<div>(<div *manual><ng-content select=".left"></ng-content></div>, <ng-content></ng-content>)</div>',
directives: [ManualViewportDirective]
@ -688,8 +688,8 @@ class InnerInnerComponent {
class ConditionalContentComponent {
}
@Component({selector: 'conditional-text'})
@View({
@Component({
selector: 'conditional-text',
template:
'MAIN(<template manual>FIRST(<template manual>SECOND(<ng-content></ng-content>)</template>)</template>)',
directives: [ManualViewportDirective]
@ -697,16 +697,17 @@ class ConditionalContentComponent {
class ConditionalTextComponent {
}
@Component({selector: 'tab'})
@View({
@Component({
selector: 'tab',
template: '<div><div *manual>TAB(<ng-content></ng-content>)</div></div>',
directives: [ManualViewportDirective]
})
class Tab {
}
@Component({selector: 'tree', inputs: ['depth']})
@View({
@Component({
selector: 'tree',
inputs: ['depth'],
template: 'TREE({{depth}}:<tree *manual [depth]="depth+1"></tree>)',
directives: [ManualViewportDirective, Tree]
})
@ -715,8 +716,7 @@ class Tree {
}
@Component({selector: 'cmp-d'})
@View({template: `<d>{{tagName}}</d>`})
@Component({selector: 'cmp-d', template: `<d>{{tagName}}</d>`})
class CmpD {
tagName: string;
constructor(elementRef: ElementRef) {
@ -725,8 +725,7 @@ class CmpD {
}
@Component({selector: 'cmp-c'})
@View({template: `<c>{{tagName}}</c>`})
@Component({selector: 'cmp-c', template: `<c>{{tagName}}</c>`})
class CmpC {
tagName: string;
constructor(elementRef: ElementRef) {
@ -735,43 +734,37 @@ class CmpC {
}
@Component({selector: 'cmp-b'})
@View({template: `<ng-content></ng-content><cmp-d></cmp-d>`, directives: [CmpD]})
@Component({selector: 'cmp-b', template: `<ng-content></ng-content><cmp-d></cmp-d>`, directives: [CmpD]})
class CmpB {
}
@Component({selector: 'cmp-a'})
@View({template: `<ng-content></ng-content><cmp-c></cmp-c>`, directives: [CmpC]})
@Component({selector: 'cmp-a', template: `<ng-content></ng-content><cmp-c></cmp-c>`, directives: [CmpC]})
class CmpA {
}
@Component({selector: 'cmp-b11'})
@View({template: `{{'b11'}}`, directives: []})
@Component({selector: 'cmp-b11', template: `{{'b11'}}`, directives: []})
class CmpB11 {
}
@Component({selector: 'cmp-b12'})
@View({template: `{{'b12'}}`, directives: []})
@Component({selector: 'cmp-b12', template: `{{'b12'}}`, directives: []})
class CmpB12 {
}
@Component({selector: 'cmp-b21'})
@View({template: `{{'b21'}}`, directives: []})
@Component({selector: 'cmp-b21', template: `{{'b21'}}`, directives: []})
class CmpB21 {
}
@Component({selector: 'cmp-b22'})
@View({template: `{{'b22'}}`, directives: []})
@Component({selector: 'cmp-b22', template: `{{'b22'}}`, directives: []})
class CmpB22 {
}
@Component({selector: 'cmp-a1'})
@View({template: `{{'a1'}}<cmp-b11></cmp-b11><cmp-b12></cmp-b12>`, directives: [CmpB11, CmpB12]})
@Component(
{selector: 'cmp-a1', template: `{{'a1'}}<cmp-b11></cmp-b11><cmp-b12></cmp-b12>`, directives: [CmpB11, CmpB12]})
class CmpA1 {
}
@Component({selector: 'cmp-a2'})
@View({template: `{{'a2'}}<cmp-b21></cmp-b21><cmp-b22></cmp-b22>`, directives: [CmpB21, CmpB22]})
@Component(
{selector: 'cmp-a2', template: `{{'a2'}}<cmp-b21></cmp-b21><cmp-b22></cmp-b22>`, directives: [CmpB21, CmpB22]})
class CmpA2 {
}

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

@ -23,7 +23,6 @@ import {
TemplateRef,
Query,
QueryList,
View,
ViewQuery,
ContentChildren,
ViewChildren,
@ -693,8 +692,7 @@ class TextDirective {
constructor() {}
}
@Component({selector: 'needs-content-children'})
@View({template: ''})
@Component({selector: 'needs-content-children', template: ''})
class NeedsContentChildren implements AfterContentInit {
@ContentChildren(TextDirective) textDirChildren: QueryList<TextDirective>;
numberOfChildrenAfterContentInit: number;
@ -702,8 +700,8 @@ class NeedsContentChildren implements AfterContentInit {
ngAfterContentInit() { this.numberOfChildrenAfterContentInit = this.textDirChildren.length; }
}
@Component({selector: 'needs-view-children'})
@View({template: '<div text></div>', directives: [TextDirective]})
@Component(
{selector: 'needs-view-children', template: '<div text></div>', directives: [TextDirective]})
class NeedsViewChildren implements AfterViewInit {
@ViewChildren(TextDirective) textDirChildren: QueryList<TextDirective>;
numberOfChildrenAfterViewInit: number;
@ -711,8 +709,7 @@ class NeedsViewChildren implements AfterViewInit {
ngAfterViewInit() { this.numberOfChildrenAfterViewInit = this.textDirChildren.length; }
}
@Component({selector: 'needs-content-child'})
@View({template: ''})
@Component({selector: 'needs-content-child', template: ''})
class NeedsContentChild implements AfterContentInit, AfterContentChecked {
_child: TextDirective;
@ -732,8 +729,8 @@ class NeedsContentChild implements AfterContentInit, AfterContentChecked {
}
}
@Component({selector: 'needs-view-child'})
@View({
@Component({
selector: 'needs-view-child',
template: `
<div *ngIf="shouldShow" text="foo"></div>
`,
@ -764,8 +761,8 @@ class InertDirective {
constructor() {}
}
@Component({selector: 'needs-query'})
@View({
@Component({
selector: 'needs-query',
directives: [NgFor, TextDirective],
template: '<div text="ignoreme"></div><b *ngFor="var dir of query">{{dir.text}}|</b>'
})
@ -775,8 +772,7 @@ class NeedsQuery {
constructor(@Query(TextDirective) query: QueryList<TextDirective>) { this.query = query; }
}
@Component({selector: 'needs-four-queries'})
@View({template: ''})
@Component({selector: 'needs-four-queries', template: ''})
class NeedsFourQueries {
@ContentChild(TextDirective) query1: TextDirective;
@ContentChild(TextDirective) query2: TextDirective;
@ -784,8 +780,11 @@ class NeedsFourQueries {
@ContentChild(TextDirective) query4: TextDirective;
}
@Component({selector: 'needs-query-desc'})
@View({directives: [NgFor], template: '<div *ngFor="var dir of query">{{dir.text}}|</div>'})
@Component({
selector: 'needs-query-desc',
directives: [NgFor],
template: '<div *ngFor="var dir of query">{{dir.text}}|</div>'
})
@Injectable()
class NeedsQueryDesc {
query: QueryList<TextDirective>;
@ -794,8 +793,7 @@ class NeedsQueryDesc {
}
}
@Component({selector: 'needs-query-by-var-binding'})
@View({directives: [], template: '<ng-content>'})
@Component({selector: 'needs-query-by-var-binding', directives: [], template: '<ng-content>'})
@Injectable()
class NeedsQueryByLabel {
query: QueryList<any>;
@ -804,16 +802,18 @@ class NeedsQueryByLabel {
}
}
@Component({selector: 'needs-view-query-by-var-binding'})
@View({directives: [], template: '<div #textLabel>text</div>'})
@Component({
selector: 'needs-view-query-by-var-binding',
directives: [],
template: '<div #textLabel>text</div>'
})
@Injectable()
class NeedsViewQueryByLabel {
query: QueryList<any>;
constructor(@ViewQuery("textLabel") query: QueryList<any>) { this.query = query; }
}
@Component({selector: 'needs-query-by-var-bindings'})
@View({directives: [], template: '<ng-content>'})
@Component({selector: 'needs-query-by-var-bindings', directives: [], template: '<ng-content>'})
@Injectable()
class NeedsQueryByTwoLabels {
query: QueryList<any>;
@ -822,8 +822,8 @@ class NeedsQueryByTwoLabels {
}
}
@Component({selector: 'needs-query-and-project'})
@View({
@Component({
selector: 'needs-query-and-project',
directives: [NgFor],
template: '<div *ngFor="var dir of query">{{dir.text}}|</div><ng-content></ng-content>'
})
@ -833,8 +833,8 @@ class NeedsQueryAndProject {
constructor(@Query(TextDirective) query: QueryList<TextDirective>) { this.query = query; }
}
@Component({selector: 'needs-view-query'})
@View({
@Component({
selector: 'needs-view-query',
directives: [TextDirective],
template: '<div text="1"><div text="2"></div></div>' +
'<div text="3"></div><div text="4"></div>'
@ -845,8 +845,11 @@ class NeedsViewQuery {
constructor(@ViewQuery(TextDirective) query: QueryList<TextDirective>) { this.query = query; }
}
@Component({selector: 'needs-view-query-if'})
@View({directives: [NgIf, TextDirective], template: '<div *ngIf="show" text="1"></div>'})
@Component({
selector: 'needs-view-query-if',
directives: [NgIf, TextDirective],
template: '<div *ngIf="show" text="1"></div>'
})
@Injectable()
class NeedsViewQueryIf {
show: boolean;
@ -858,8 +861,8 @@ class NeedsViewQueryIf {
}
@Component({selector: 'needs-view-query-nested-if'})
@View({
@Component({
selector: 'needs-view-query-nested-if',
directives: [NgIf, InertDirective, TextDirective],
template: '<div text="1"><div *ngIf="show"><div dir></div></div></div>'
})
@ -873,8 +876,8 @@ class NeedsViewQueryNestedIf {
}
}
@Component({selector: 'needs-view-query-order'})
@View({
@Component({
selector: 'needs-view-query-order',
directives: [NgFor, TextDirective, InertDirective],
template: '<div text="1"></div>' +
'<div *ngFor="var i of list" [text]="i"></div>' +
@ -890,8 +893,8 @@ class NeedsViewQueryOrder {
}
}
@Component({selector: 'needs-view-query-order-with-p'})
@View({
@Component({
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>' +
@ -907,8 +910,7 @@ class NeedsViewQueryOrderWithParent {
}
}
@Component({selector: 'needs-tpl'})
@View({template: '<template var-x="shadow"></template>'})
@Component({selector: 'needs-tpl', template: '<template var-x="shadow"></template>'})
class NeedsTpl {
viewQuery: QueryList<TemplateRef>;
query: QueryList<TemplateRef>;
@ -919,8 +921,8 @@ class NeedsTpl {
}
}
@Component({selector: 'my-comp'})
@View({
@Component({
selector: 'my-comp',
directives: [
NeedsQuery,
NeedsQueryDesc,
@ -943,7 +945,8 @@ class NeedsTpl {
NgIf,
NgFor,
NeedsFourQueries
]
],
template: ''
})
@Injectable()
class MyComp {

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

@ -1,13 +1,17 @@
import {ddescribe, describe, it, iit, expect, beforeEach} from 'angular2/testing_internal';
import {ViewResolver} from 'angular2/src/core/linker/view_resolver';
import {Component, View, ViewMetadata} from 'angular2/src/core/metadata';
import {Component, ViewMetadata} from 'angular2/src/core/metadata';
class SomeDir {}
class SomePipe {}
@Component({selector: 'sample'})
@View(
{template: "some template", directives: [SomeDir], pipes: [SomePipe], styles: ["some styles"]})
@Component({
selector: 'sample',
template: "some template",
directives: [SomeDir],
pipes: [SomePipe],
styles: ["some styles"]
})
class ComponentWithView {
}
@ -22,12 +26,10 @@ class ComponentWithTemplate {
}
@Component({selector: 'sample', template: "some template"})
@View({template: "some template"})
class ComponentWithViewTemplate {
}
@Component({selector: 'sample', templateUrl: "some template url"})
@View({template: "some template"})
@Component({selector: 'sample', templateUrl: "some template url", template: "some template"})
class ComponentWithViewTemplateUrl {
}
@ -35,9 +37,6 @@ class ComponentWithViewTemplateUrl {
class ComponentWithoutView {
}
@View({template: "some template"})
class ClassWithView {
}
class SimpleClass {}
@ -47,17 +46,6 @@ export function main() {
beforeEach(() => { resolver = new ViewResolver(); });
it('should read out the View metadata', () => {
var viewMetadata = resolver.resolve(ComponentWithView);
expect(viewMetadata)
.toEqual(new View({
template: "some template",
directives: [SomeDir],
pipes: [SomePipe],
styles: ["some styles"]
}));
});
it('should read out the View metadata from the Component metadata', () => {
var viewMetadata = resolver.resolve(ComponentWithTemplate);
expect(viewMetadata)
@ -69,32 +57,15 @@ export function main() {
}));
});
it('should read out the View metadata from a simple class', () => {
var viewMetadata = resolver.resolve(ClassWithView);
expect(viewMetadata).toEqual(new View({template: "some template"}));
});
it('should throw when Component.template is specified together with the View metadata', () => {
expect(() => resolver.resolve(ComponentWithViewTemplate))
.toThrowErrorWith(
"Component 'ComponentWithViewTemplate' cannot have both 'template' and '@View' set at the same time");
});
it('should throw when Component.template is specified together with the View metadata', () => {
expect(() => resolver.resolve(ComponentWithViewTemplateUrl))
.toThrowErrorWith(
"Component 'ComponentWithViewTemplateUrl' cannot have both 'templateUrl' and '@View' set at the same time");
});
it('should throw when Component has no View decorator and no template is set', () => {
expect(() => resolver.resolve(ComponentWithoutView))
.toThrowErrorWith(
"Component 'ComponentWithoutView' must have either 'template', 'templateUrl', or '@View' set");
"Component 'ComponentWithoutView' must have either 'template' or 'templateUrl' set");
});
it('should throw when simple class has no View decorator and no template is set', () => {
expect(() => resolver.resolve(SimpleClass))
.toThrowErrorWith("No View decorator found on component 'SimpleClass'");
.toThrowErrorWith("Could not compile 'SimpleClass' because it is not a component.");
});
});
}

2
modules/angular2/test/core/metadata/decorators_spec.ts
View File

@ -10,7 +10,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {Component, View, Directive} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
import {reflector} from 'angular2/src/core/reflection/reflection';
export function main() {

6
modules/angular2/test/mock/view_resolver_mock_spec.ts
View File

@ -12,7 +12,7 @@ import {stringify} from 'angular2/src/facade/lang';
import {MockViewResolver} from 'angular2/src/mock/view_resolver_mock';
import {Component, View, ViewMetadata} from 'angular2/src/core/metadata';
import {Component, ViewMetadata} from 'angular2/src/core/metadata';
import {isBlank} from 'angular2/src/facade/lang';
@ -108,8 +108,8 @@ export function main() {
class SomeDirective {}
@Component({selector: 'cmp'})
@View({
@Component({
selector: 'cmp',
template: 'template',
directives: [SomeDirective],
})

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

@ -16,7 +16,7 @@ import {IS_DART, isPresent, stringify} from 'angular2/src/facade/lang';
import {bootstrap} from 'angular2/platform/browser';
import {ApplicationRef} from 'angular2/src/core/application_ref';
import {Console} from 'angular2/src/core/console';
import {Component, Directive, View, OnDestroy, platform} from 'angular2/core';
import {Component, Directive, OnDestroy, platform} from 'angular2/core';
import {BROWSER_PROVIDERS, BROWSER_APP_PROVIDERS} from 'angular2/platform/browser';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {DOCUMENT} from 'angular2/src/platform/dom/dom_tokens';
@ -27,36 +27,31 @@ import {ExceptionHandler} from 'angular2/src/facade/exceptions';
import {Testability, TestabilityRegistry} from 'angular2/src/core/testability/testability';
import {ComponentRef_, ComponentRef} from "angular2/src/core/linker/dynamic_component_loader";
@Component({selector: 'hello-app'})
@View({template: '{{greeting}} world!'})
@Component({selector: 'hello-app', template: '{{greeting}} world!'})
class HelloRootCmp {
greeting: string;
constructor() { this.greeting = 'hello'; }
}
@Component({selector: 'hello-app'})
@View({template: 'before: <ng-content></ng-content> after: done'})
@Component({selector: 'hello-app', template: 'before: <ng-content></ng-content> after: done'})
class HelloRootCmpContent {
constructor() {}
}
@Component({selector: 'hello-app-2'})
@View({template: '{{greeting}} world, again!'})
@Component({selector: 'hello-app-2', template: '{{greeting}} world, again!'})
class HelloRootCmp2 {
greeting: string;
constructor() { this.greeting = 'hello'; }
}
@Component({selector: 'hello-app'})
@View({template: ''})
@Component({selector: 'hello-app', template: ''})
class HelloRootCmp3 {
appBinding;
constructor(@Inject("appBinding") appBinding) { this.appBinding = appBinding; }
}
@Component({selector: 'hello-app'})
@View({template: ''})
@Component({selector: 'hello-app', template: ''})
class HelloRootCmp4 {
appRef;
@ -71,8 +66,7 @@ class HelloRootMissingTemplate {
class HelloRootDirectiveIsNotCmp {
}
@Component({selector: 'hello-app'})
@View({template: ''})
@Component({selector: 'hello-app', template: ''})
class HelloOnDestroyTickCmp implements OnDestroy {
appRef: ApplicationRef;
constructor(@Inject(ApplicationRef) appRef) { this.appRef = appRef; }

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

@ -222,7 +222,16 @@ var NG_CORE = [
'setTestabilityGetter',
'Type',
'PACKAGE_ROOT_URL',
'View',
'View:dart',
/*
'View.directives:dart',
'View.encapsulation:dart',
'View.pipes:dart',
'View.styleUrls:dart',
'View.styles:dart',
'View.template:dart',
'View.templateUrl:dart',
*/
'ViewChild',
'ViewChildMetadata',
'ViewChildren',

9
modules/angular2/test/router/directives/router_link_spec.ts
View File

@ -16,7 +16,7 @@ import {
import {SpyRouter, SpyLocation} from '../spies';
import {provide, Component, View} from 'angular2/core';
import {provide, Component} from 'angular2/core';
import {By} from 'angular2/platform/common_dom';
import {
@ -102,15 +102,14 @@ export function main() {
});
}
@Component({selector: 'user-cmp'})
@View({template: "hello {{user}}"})
@Component({selector: 'user-cmp', template: "hello {{user}}"})
class UserCmp {
user: string;
constructor(params: RouteParams) { this.user = params.get('name'); }
}
@Component({selector: 'test-component'})
@View({
@Component({
selector: 'test-component',
template: `
<div>
<a [routerLink]="['/Detail']"

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

@ -15,7 +15,7 @@ import {
} from 'angular2/testing_internal';
import {bootstrap} from 'angular2/platform/browser';
import {Component, Directive, View} from 'angular2/src/core/metadata';
import {Component, Directive} from 'angular2/src/core/metadata';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {Console} from 'angular2/src/core/console';
import {provide, ViewChild, AfterViewInit} from 'angular2/core';

2
modules/angular2/test/router/integration/lifecycle_hook_spec.ts
View File

@ -15,7 +15,7 @@ import {
xit
} from 'angular2/testing_internal';
import {provide, Component, Injector, Inject, View} from 'angular2/core';
import {provide, Component, Injector, Inject} from 'angular2/core';
import {isPresent} from 'angular2/src/facade/lang';
import {
PromiseWrapper,

2
modules/angular2/test/router/integration/navigation_spec.ts
View File

@ -15,7 +15,7 @@ import {
xit
} from 'angular2/testing_internal';
import {provide, Component, View, Injector, Inject} from 'angular2/core';
import {provide, Component, Injector, Inject} from 'angular2/core';
import {PromiseWrapper} from 'angular2/src/facade/async';
import {Router, RouterOutlet, RouterLink, RouteParams, RouteData, Location} from 'angular2/router';

9
modules/angular2/test/router/integration/router_link_spec.ts
View File

@ -22,7 +22,7 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
import {PromiseWrapper} from 'angular2/src/facade/async';
import {ListWrapper} from 'angular2/src/facade/collection';
import {provide, Component, View, DirectiveResolver} from 'angular2/core';
import {provide, Component, DirectiveResolver} from 'angular2/core';
import {SpyLocation} from 'angular2/src/mock/location_mock';
import {
@ -69,10 +69,7 @@ export function main() {
}));
function compile(template: string = "<router-outlet></router-outlet>") {
return tcb.overrideView(MyComp, new View({
template: ('<div>' + template + '</div>'),
directives: [RouterOutlet, RouterLink]
}))
return tcb.overrideTemplate(MyComp, ('<div>' + template + '</div>'))
.createAsync(MyComp)
.then((tc) => { fixture = tc; });
}
@ -382,7 +379,7 @@ function getHref(tc: ComponentFixture) {
return DOM.getAttribute(tc.debugElement.query(By.css('a')).nativeElement, 'href');
}
@Component({selector: 'my-comp'})
@Component({selector: 'my-comp', template: '', directives: [ROUTER_DIRECTIVES]})
class MyComp {
name;
}

2
modules/angular2/test/router/integration/util.ts
View File

@ -1,4 +1,4 @@
import {provide, Provider, Component, View} from 'angular2/core';
import {provide, Provider, Component} from 'angular2/core';
import {Type, isBlank} from 'angular2/src/facade/lang';
import {BaseException} from 'angular2/src/facade/exceptions';

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

@ -12,7 +12,7 @@ import {
} from 'angular2/testing_internal';
import {bootstrap} from 'angular2/platform/browser';
import {Component, Directive, View} from 'angular2/src/core/metadata';
import {Component, Directive} from 'angular2/src/core/metadata';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {Console} from 'angular2/src/core/console';
import {provide} from 'angular2/core';
@ -213,13 +213,15 @@ export function main() {
}
@Component({selector: 'hello-cmp'})
@View({template: 'hello'})
@Component({selector: 'hello-cmp', template: 'hello'})
class HelloCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
{path: '/before', redirectTo: ['Hello']},
{path: '/after', component: HelloCmp, name: 'Hello'}
@ -232,8 +234,11 @@ function HelloLoader(): Promise<any> {
return Promise.resolve(HelloCmp);
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
{path: '/hello', component: {type: 'loader', loader: HelloLoader}},
])
@ -241,8 +246,11 @@ class AsyncAppCmp {
constructor(public router: Router, public location: LocationStrategy) {}
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
{path: '/hello', loader: HelloLoader},
])
@ -250,15 +258,21 @@ class ConciseAsyncAppCmp {
constructor(public router: Router, public location: LocationStrategy) {}
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> } aside { <router-outlet name="aside"></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> } aside { <router-outlet name="aside"></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/hello', component: HelloCmp}, {aux: 'aside', component: HelloCmp}])
class AuxAppCmp {
constructor(public router: Router, public location: LocationStrategy) {}
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
{path: '/hello', component: {type: 'constructor', constructor: HelloCmp}},
])
@ -266,45 +280,66 @@ class ExplicitConstructorAppCmp {
constructor(public router: Router, public location: LocationStrategy) {}
}
@Component({selector: 'parent-cmp'})
@View({template: `parent { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'parent-cmp',
template: `parent { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/child', component: HelloCmp}])
class ParentCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/parent/...', component: ParentCmp}])
class HierarchyAppCmp {
constructor(public router: Router, public location: LocationStrategy) {}
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/hello'}])
class WrongConfigCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/child', component: HelloCmp, name: 'child'}])
class BadAliasNameCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/child', component: HelloCmp, as: 'child'}])
class BadAliasCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([{path: '/child', component: HelloCmp, as: 'Child', name: 'Child'}])
class MultipleAliasCmp {
}
@Component({selector: 'app-cmp'})
@View({template: `root { <router-outlet></router-outlet> }`, directives: ROUTER_DIRECTIVES})
@Component({
selector: 'app-cmp',
template: `root { <router-outlet></router-outlet> }`,
directives: ROUTER_DIRECTIVES
})
@RouteConfig([
{path: '/hello', component: {type: 'intentionallyWrongComponentType', constructor: HelloCmp}},
])

47
modules/angular2/test/testing/test_component_builder_spec.ts
View File

@ -16,43 +16,47 @@ import {
import {Injectable, provide} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {Directive, Component, View, ViewMetadata} from 'angular2/src/core/metadata';
import {Directive, Component, ViewMetadata} from 'angular2/src/core/metadata';
@Component({selector: 'child-comp'})
@View({template: `<span>Original {{childBinding}}</span>`, directives: []})
@Component(
{selector: 'child-comp', template: `<span>Original {{childBinding}}</span>`, directives: []})
@Injectable()
class ChildComp {
childBinding: string;
constructor() { this.childBinding = 'Child'; }
}
@Component({selector: 'child-comp'})
@View({template: `<span>Mock</span>`})
@Component({selector: 'child-comp', template: `<span>Mock</span>`})
@Injectable()
class MockChildComp {
}
@Component({selector: 'parent-comp'})
@View({template: `Parent(<child-comp></child-comp>)`, directives: [ChildComp]})
@Component({
selector: 'parent-comp',
template: `Parent(<child-comp></child-comp>)`,
directives: [ChildComp]
})
@Injectable()
class ParentComp {
}
@Component({selector: 'my-if-comp'})
@View({template: `MyIf(<span *ngIf="showMore">More</span>)`, directives: [NgIf]})
@Component({
selector: 'my-if-comp',
template: `MyIf(<span *ngIf="showMore">More</span>)`,
directives: [NgIf]
})
@Injectable()
class MyIfComp {
showMore: boolean = false;
}
@Component({selector: 'child-child-comp'})
@View({template: `<span>ChildChild</span>`})
@Component({selector: 'child-child-comp', template: `<span>ChildChild</span>`})
@Injectable()
class ChildChildComp {
}
@Component({selector: 'child-comp'})
@View({
@Component({
selector: 'child-comp',
template: `<span>Original {{childBinding}}(<child-child-comp></child-child-comp>)</span>`,
directives: [ChildChildComp]
})
@ -62,8 +66,7 @@ class ChildWithChildComp {
constructor() { this.childBinding = 'Child'; }
}
@Component({selector: 'child-child-comp'})
@View({template: `<span>ChildChild Mock</span>`})
@Component({selector: 'child-child-comp', template: `<span>ChildChild Mock</span>`})
@Injectable()
class MockChildChildComp {
}
@ -78,14 +81,20 @@ class MockFancyService extends FancyService {
value: string = 'mocked out value';
}
@Component({selector: 'my-service-comp', bindings: [FancyService]})
@View({template: `injected value: {{fancyService.value}}`})
@Component({
selector: 'my-service-comp',
bindings: [FancyService],
template: `injected value: {{fancyService.value}}`
})
class TestBindingsComp {
constructor(private fancyService: FancyService) {}
}
@Component({selector: 'my-service-comp', viewProviders: [FancyService]})
@View({template: `injected value: {{fancyService.value}}`})
@Component({
selector: 'my-service-comp',
viewProviders: [FancyService],
template: `injected value: {{fancyService.value}}`
})
class TestViewBindingsComp {
constructor(private fancyService: FancyService) {}
}

56
modules/angular2/test/testing/testing_public_spec.ts
View File

@ -18,48 +18,52 @@ import {
import {Injectable, bind} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {Directive, Component, View, ViewMetadata} from 'angular2/core';
import {Directive, Component, ViewMetadata} from 'angular2/core';
import {PromiseWrapper} from 'angular2/src/facade/promise';
import {XHR} from 'angular2/src/compiler/xhr';
import {XHRImpl} from 'angular2/src/platform/browser/xhr_impl';
// Services, and components for the tests.
@Component({selector: 'child-comp'})
@View({template: `<span>Original {{childBinding}}</span>`, directives: []})
@Component(
{selector: 'child-comp', template: `<span>Original {{childBinding}}</span>`, directives: []})
@Injectable()
class ChildComp {
childBinding: string;
constructor() { this.childBinding = 'Child'; }
}
@Component({selector: 'child-comp'})
@View({template: `<span>Mock</span>`})
@Component({selector: 'child-comp', template: `<span>Mock</span>`})
@Injectable()
class MockChildComp {
}
@Component({selector: 'parent-comp'})
@View({template: `Parent(<child-comp></child-comp>)`, directives: [ChildComp]})
@Component({
selector: 'parent-comp',
template: `Parent(<child-comp></child-comp>)`,
directives: [ChildComp]
})
@Injectable()
class ParentComp {
}
@Component({selector: 'my-if-comp'})
@View({template: `MyIf(<span *ngIf="showMore">More</span>)`, directives: [NgIf]})
@Component({
selector: 'my-if-comp',
template: `MyIf(<span *ngIf="showMore">More</span>)`,
directives: [NgIf]
})
@Injectable()
class MyIfComp {
showMore: boolean = false;
}
@Component({selector: 'child-child-comp'})
@View({template: `<span>ChildChild</span>`})
@Component({selector: 'child-child-comp', template: `<span>ChildChild</span>`})
@Injectable()
class ChildChildComp {
}
@Component({selector: 'child-comp'})
@View({
@Component({
selector: 'child-comp',
template: `<span>Original {{childBinding}}(<child-child-comp></child-child-comp>)</span>`,
directives: [ChildChildComp]
})
@ -69,8 +73,7 @@ class ChildWithChildComp {
constructor() { this.childBinding = 'Child'; }
}
@Component({selector: 'child-child-comp'})
@View({template: `<span>ChildChild Mock</span>`})
@Component({selector: 'child-child-comp', template: `<span>ChildChild Mock</span>`})
@Injectable()
class MockChildChildComp {
}
@ -84,25 +87,32 @@ class MockFancyService extends FancyService {
value: string = 'mocked out value';
}
@Component({selector: 'my-service-comp', providers: [FancyService]})
@View({template: `injected value: {{fancyService.value}}`})
@Component({
selector: 'my-service-comp',
providers: [FancyService],
template: `injected value: {{fancyService.value}}`
})
class TestProvidersComp {
constructor(private fancyService: FancyService) {}
}
@Component({selector: 'my-service-comp', viewProviders: [FancyService]})
@View({template: `injected value: {{fancyService.value}}`})
@Component({
selector: 'my-service-comp',
viewProviders: [FancyService],
template: `injected value: {{fancyService.value}}`
})
class TestViewProvidersComp {
constructor(private fancyService: FancyService) {}
}
@Component({selector: 'external-template-comp'})
@View({templateUrl: '/base/modules/angular2/test/testing/static_assets/test.html'})
@Component({
selector: 'external-template-comp',
templateUrl: '/base/modules/angular2/test/testing/static_assets/test.html'
})
class ExternalTemplateComp {
}
@Component({selector: 'bad-template-comp'})
@View({templateUrl: 'non-existant.html'})
@Component({selector: 'bad-template-comp', templateUrl: 'non-existant.html'})
class BadTemplateUrl {
}

8
modules/angular2/test/upgrade/metadata_spec.ts
View File

@ -11,7 +11,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {getComponentInfo, parseFields} from 'angular2/src/upgrade/metadata';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
@ -67,13 +67,11 @@ export function main() {
});
}
@Component({selector: 'element-name-dashed'})
@View({template: ``})
@Component({selector: 'element-name-dashed', template: ``})
class ElementNameComponent {
}
@Component({selector: '[attr-name]'})
@View({template: ``})
@Component({selector: '[attr-name]', template: ``})
class AttributeNameComponent {
}

4
modules/angular2/test/web_workers/worker/renderer_integration_spec.ts
View File

@ -20,7 +20,6 @@ import {
Injector,
ViewMetadata,
Component,
View,
Injectable,
ElementRef
} from 'angular2/core';
@ -257,8 +256,7 @@ export function main() {
}
@Component({selector: 'my-comp'})
@View({directives: []})
@Component({selector: 'my-comp', directives: []})
@Injectable()
class MyComp {
ctxProp: string;

6
modules/angular2_material/src/components/button/button.ts
View File

@ -1,4 +1,4 @@
import {Component, View, ViewEncapsulation, OnChanges} from 'angular2/core';
import {Component, ViewEncapsulation, OnChanges} from 'angular2/core';
import {TimerWrapper} from 'angular2/src/facade/async';
import {isPresent} from 'angular2/src/facade/lang';
@ -15,8 +15,6 @@ import {isPresent} from 'angular2/src/facade/lang';
'(blur)': 'onBlur()',
'[class.md-button-focus]': 'isKeyboardFocused',
},
})
@View({
templateUrl: 'package:angular2_material/src/components/button/button.html',
styleUrls: ['package:angular2_material/src/components/button/button.css'],
encapsulation: ViewEncapsulation.None,
@ -59,8 +57,6 @@ export class MdButton {
'[class.md-button-focus]': 'isKeyboardFocused',
'[attr.aria-disabled]': 'isAriaDisabled',
},
})
@View({
templateUrl: 'package:angular2_material/src/components/button/button.html',
encapsulation: ViewEncapsulation.None
})

6
modules/angular2_material/src/components/checkbox/checkbox.ts
View File

@ -1,4 +1,4 @@
import {Component, View, Attribute, ViewEncapsulation} from 'angular2/core';
import {Component, Attribute, ViewEncapsulation} from 'angular2/core';
import {isPresent} from 'angular2/src/facade/lang';
import {KeyCodes} from 'angular2_material/src/core/key_codes';
import {KeyboardEvent} from 'angular2/src/facade/browser';
@ -13,9 +13,7 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
'[attr.aria-disabled]': 'disabled',
'[tabindex]': 'tabindex',
'(keydown)': 'onKeydown($event)',
}
})
@View({
},
templateUrl: 'package:angular2_material/src/components/checkbox/checkbox.html',
directives: [],
encapsulation: ViewEncapsulation.None

6
modules/angular2_material/src/components/dialog/dialog.ts
View File

@ -12,7 +12,6 @@ import {
ResolvedProvider,
SkipSelf,
Injector,
View,
ViewEncapsulation
} from 'angular2/core';
@ -212,8 +211,6 @@ export class MdDialogConfig {
'tabindex': '0',
'(body:keydown)': 'documentKeypress($event)',
},
})
@View({
encapsulation: ViewEncapsulation.None,
templateUrl: 'package:angular2_material/src/components/dialog/dialog.html',
directives: [forwardRef(() => MdDialogContent)]
@ -261,8 +258,9 @@ class MdDialogContent {
host: {
'(click)': 'onClick()',
},
template: '',
encapsulation: ViewEncapsulation.None
})
@View({template: '', encapsulation: ViewEncapsulation.None})
class MdBackdrop {
dialogRef: MdDialogRef;

10
modules/angular2_material/src/components/grid_list/grid_list.ts
View File

@ -1,6 +1,5 @@
import {
Component,
View,
ViewEncapsulation,
Host,
SkipSelf,
@ -27,8 +26,9 @@ class RowHeightMode {
}
@Component({selector: 'md-grid-list', inputs: ['cols', 'rowHeight', 'gutterSize']})
@View({
@Component({
selector: 'md-grid-list',
inputs: ['cols', 'rowHeight', 'gutterSize'],
templateUrl: 'package:angular2_material/src/components/grid_list/grid_list.html',
encapsulation: ViewEncapsulation.None
})
@ -223,9 +223,7 @@ export class MdGridList implements AfterContentChecked {
'[style.left]': 'style.left',
'[style.marginTop]': 'style.marginTop',
'[style.paddingTop]': 'style.paddingTop',
}
})
@View({
},
templateUrl: 'package:angular2_material/src/components/grid_list/grid_tile.html',
encapsulation: ViewEncapsulation.None
})

6
modules/angular2_material/test/button_spec.ts
View File

@ -13,7 +13,7 @@ import {
xit,
} from 'angular2/testing_internal';
import {Component, View, ViewMetadata, bind, provide, DebugElement} from 'angular2/core';
import {Component, ViewMetadata, bind, provide, DebugElement} from 'angular2/core';
import {UrlResolver} from 'angular2/compiler';
import {MdButton, MdAnchor} from 'angular2_material/src/components/button/button';
@ -114,8 +114,8 @@ function getChildDebugElement(parent: DebugElement, tagName: string): DebugEleme
}
/** Test component that contains an MdButton. */
@Component({selector: 'test-app'})
@View({
@Component({
selector: 'test-app',
directives: [MdButton],
template:
`<button mdButton type="button" (click)="increment()" [disabled]="isDisabled">Go</button>`

12
modules/benchmarks/src/compiler/compiler_benchmark.ts
View File

@ -9,7 +9,6 @@ import {
Compiler,
Component,
Directive,
View,
ViewContainerRef,
bind,
provide,
@ -91,8 +90,7 @@ class MultiplyViewResolver extends ViewResolver {
}
}
@Component({selector: 'app'})
@View({directives: [], template: ``})
@Component({selector: 'app', directives: [], template: ``})
class CompilerAppComponent {
constructor(private _compiler: Compiler) {}
compileNoBindings() {
@ -131,8 +129,8 @@ class Dir4 {
}
@Component({selector: 'cmp-nobind'})
@View({
@Component({
selector: 'cmp-nobind',
directives: [Dir0, Dir1, Dir2, Dir3, Dir4],
template: `
<div class="class0 class1 class2 class3 class4 " nodir0="" attr0="value0" nodir1="" attr1="value1" nodir2="" attr2="value2" nodir3="" attr3="value3" nodir4="" attr4="value4">
@ -149,8 +147,8 @@ class Dir4 {
class BenchmarkComponentNoBindings {
}
@Component({selector: 'cmp-withbind'})
@View({
@Component({
selector: 'cmp-withbind',
directives: [Dir0, Dir1, Dir2, Dir3, Dir4],
template: `
<div class="class0 class1 class2 class3 class4 " dir0="" [attr0]="value0" dir1="" [attr1]="value1" dir2="" [attr2]="value2" dir3="" [attr3]="value3" dir4="" [attr4]="value4">

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

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, Directive, DynamicComponentLoader, ElementRef, View} from 'angular2/core';
import {Component, Directive, DynamicComponentLoader, ElementRef} from 'angular2/core';
import {NgIf, NgFor} from 'angular2/common';
import {ApplicationRef} from 'angular2/src/core/application_ref';
import {ListWrapper} from 'angular2/src/facade/collection';
@ -43,8 +43,7 @@ export function main() {
}
@Component({selector: 'dummy'})
@View({template: `<div></div>`})
@Component({selector: 'dummy', template: `<div></div>`})
class DummyComponent {
}
@ -59,8 +58,8 @@ class DynamicDummy {
}
}
@Component({selector: 'app'})
@View({
@Component({
selector: 'app',
directives: [NgIf, NgFor, DummyComponent, DummyDirective, DynamicDummy],
template: `
<div *ngIf="testingPlainComponents">

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

@ -8,7 +8,7 @@ import {
windowProfileEnd
} from 'angular2/src/testing/benchmark_util';
import {bootstrap} from 'angular2/bootstrap';
import {Component, Directive, View, bind, provide} from 'angular2/core';
import {Component, Directive, bind, provide} from 'angular2/core';
import {NgFor, NgSwitch, NgSwitchWhen, NgSwitchDefault} from 'angular2/common';
import {ApplicationRef} from 'angular2/src/core/application_ref';
import {BrowserDomAdapter} from 'angular2/src/platform/browser/browser_adapter';
@ -207,8 +207,9 @@ class CellData {
iFn() { return this.i; }
}
@Component({selector: 'largetable', inputs: ['data', 'benchmarkType']})
@View({
@Component({
selector: 'largetable',
inputs: ['data', 'benchmarkType'],
directives: [NgFor, NgSwitch, NgSwitchWhen, NgSwitchDefault],
template: `
<table [ngSwitch]="benchmarkType">
@ -255,8 +256,8 @@ class LargetableComponent {
}
}
@Component({selector: 'app'})
@View({
@Component({
selector: 'app',
directives: [LargetableComponent],
template: `<largetable [data]='data' [benchmarkType]='benchmarkType'></largetable>`
})

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

@ -6,11 +6,11 @@ import {NgIf, NgFor} from 'angular2/common';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {document} from 'angular2/src/facade/browser';
import {Component, Directive, View} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
@Component({selector: 'scroll-app'})
@View({
@Component({
selector: 'scroll-app',
directives: [ScrollAreaComponent, NgIf, NgFor],
template: `
<div>

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

@ -2,7 +2,7 @@ import {ListWrapper, Map} from 'angular2/src/facade/collection';
import {Company, Opportunity, Offering, Account, CustomDate, STATUS_LIST} from './common';
import {NgFor} from 'angular2/common';
import {Component, Directive, View} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
export class HasStyle {
cellWidth: number;
@ -12,20 +12,32 @@ export class HasStyle {
set width(w: number) { this.cellWidth = w; }
}
@Component({selector: 'company-name', inputs: ['width: cell-width', 'company']})
@View({directives: [], template: `<div [style.width.px]="cellWidth">{{company.name}}</div>`})
@Component({
selector: 'company-name',
inputs: ['width: cell-width', 'company'],
directives: [],
template: `<div [style.width.px]="cellWidth">{{company.name}}</div>`
})
export class CompanyNameComponent extends HasStyle {
company: Company;
}
@Component({selector: 'opportunity-name', inputs: ['width: cell-width', 'opportunity']})
@View({directives: [], template: `<div [style.width.px]="cellWidth">{{opportunity.name}}</div>`})
@Component({
selector: 'opportunity-name',
inputs: ['width: cell-width', 'opportunity'],
directives: [],
template: `<div [style.width.px]="cellWidth">{{opportunity.name}}</div>`
})
export class OpportunityNameComponent extends HasStyle {
opportunity: Opportunity;
}
@Component({selector: 'offering-name', inputs: ['width: cell-width', 'offering']})
@View({directives: [], template: `<div [style.width.px]="cellWidth">{{offering.name}}</div>`})
@Component({
selector: 'offering-name',
inputs: ['width: cell-width', 'offering'],
directives: [],
template: `<div [style.width.px]="cellWidth">{{offering.name}}</div>`
})
export class OfferingNameComponent extends HasStyle {
offering: Offering;
}
@ -37,8 +49,9 @@ export class Stage {
apply: Function;
}
@Component({selector: 'stage-buttons', inputs: ['width: cell-width', 'offering']})
@View({
@Component({
selector: 'stage-buttons',
inputs: ['width: cell-width', 'offering'],
directives: [NgFor],
template: `
<div [style.width.px]="cellWidth">
@ -82,8 +95,9 @@ export class StageButtonsComponent extends HasStyle {
}
}
@Component({selector: 'account-cell', inputs: ['width: cell-width', 'account']})
@View({
@Component({
selector: 'account-cell',
inputs: ['width: cell-width', 'account'],
directives: [],
template: `
<div [style.width.px]="cellWidth">
@ -96,8 +110,12 @@ export class AccountCellComponent extends HasStyle {
account: Account;
}
@Component({selector: 'formatted-cell', inputs: ['width: cell-width', 'value']})
@View({directives: [], template: `<div [style.width.px]="cellWidth">{{formattedValue}}</div>`})
@Component({
selector: 'formatted-cell',
inputs: ['width: cell-width', 'value'],
directives: [],
template: `<div [style.width.px]="cellWidth">{{formattedValue}}</div>`
})
export class FormattedCellComponent extends HasStyle {
formattedValue: string;

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

@ -1,7 +1,7 @@
import {ListWrapper} from 'angular2/src/facade/collection';
import {Math} from 'angular2/src/facade/math';
import {Component, Directive, View} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
import {
Offering,
@ -18,8 +18,6 @@ import {NgFor} from 'angular2/common';
@Component({
selector: 'scroll-area',
})
@View({
directives: [ScrollItemComponent, NgFor],
template: `
<div>

7
modules/benchmarks/src/naive_infinite_scroll/scroll_item.ts
View File

@ -7,7 +7,7 @@ import {
FormattedCellComponent
} from './cells';
import {Component, Directive, View} from 'angular2/core';
import {Component, Directive} from 'angular2/core';
import {
Offering,
@ -25,8 +25,9 @@ import {
AAT_STATUS_WIDTH
} from './common';
@Component({selector: 'scroll-item', inputs: ['offering']})
@View({
@Component({
selector: 'scroll-item',
inputs: ['offering'],
directives: [
CompanyNameComponent,
OpportunityNameComponent,

54
modules/benchmarks/src/static_tree/tree_benchmark.ts
View File

@ -4,7 +4,6 @@ import {
Compiler,
Component,
Directive,
View,
ViewContainerRef,
bind,
provide,
@ -225,21 +224,23 @@ class StaticTreeComponentBase {
get data() { return this._value; }
}
@Component({selector: 'tree', inputs: ['data']})
@View({directives: [], template: '<span>{{data.value}} </span>'})
@Component(
{selector: 'tree', inputs: ['data'], directives: [], template: '<span>{{data.value}} </span>'})
class StaticTreeComponent0 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent0],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent1 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent1],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
@ -247,64 +248,71 @@ class StaticTreeComponent2 extends StaticTreeComponentBase {
data: TreeNode;
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent2],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent3 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent3],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent4 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent4],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent5 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent5],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent6 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent6],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent7 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent7],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent8 extends StaticTreeComponentBase {
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [StaticTreeComponent8],
template: `<span> {{data.value}} <tree [data]='data.right'></tree><tree [data]='data.left'></tree></span>`
})
class StaticTreeComponent9 extends StaticTreeComponentBase {
}
@Component({selector: 'app'})
@View({
@Component({
selector: 'app',
directives: [StaticTreeComponent9, NgIf],
template: `<tree *ngIf="initData != null" [data]='initData'></tree>`
})

10
modules/benchmarks/src/tree/tree_benchmark.ts
View File

@ -3,7 +3,6 @@ import {
Compiler,
Component,
Directive,
View,
ViewContainerRef,
bind,
provide,
@ -217,8 +216,9 @@ class BaseLineIf {
}
}
@Component({selector: 'tree', inputs: ['data']})
@View({
@Component({
selector: 'tree',
inputs: ['data'],
directives: [TreeComponent, NgIf],
template:
`<span> {{data.value}} <span template='ngIf data.right != null'><tree [data]='data.right'></tree></span><span template='ngIf data.left != null'><tree [data]='data.left'></tree></span></span>`
@ -227,8 +227,8 @@ class TreeComponent {
data: TreeNode;
}
@Component({selector: 'app'})
@View({directives: [TreeComponent], template: `<tree [data]='initData'></tree>`})
@Component(
{selector: 'app', directives: [TreeComponent], template: `<tree [data]='initData'></tree>`})
class AppComponent {
initData: TreeNode;
constructor() {

6
modules/playground/src/async/index.ts
View File

@ -1,10 +1,10 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {TimerWrapper} from 'angular2/src/facade/async';
@Component({selector: 'async-app'})
@View({
@Component({
selector: 'async-app',
template: `
<div id='increment'>
<span class='val'>{{val1}}</span>

5
modules/playground/src/gestures/index.ts
View File

@ -1,8 +1,7 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
@Component({selector: 'gestures-app'})
@View({templateUrl: 'template.html'})
@Component({selector: 'gestures-app', templateUrl: 'template.html'})
class GesturesCmp {
swipeDirection: string = '-';
pinchScale: number = 1;

6
modules/playground/src/key_events/index.ts
View File

@ -1,9 +1,9 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {KeyEventsPlugin} from 'angular2/src/platform/dom/events/key_events';
@Component({selector: 'key-events-app'})
@View({
@Component({
selector: 'key-events-app',
template: `Click in the following area and press a key to display its name:<br>
<div (keydown)="onKeyDown($event)" class="sample-area" tabindex="0">{{lastKey}}</div><br>
Click in the following area and press shift.enter:<br>

4
modules/playground/src/material/button/index.ts
View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {NgFor} from 'angular2/common';
import {UrlResolver} from 'angular2/compiler';
import {MdButton, MdAnchor} from 'angular2_material/src/components/button/button';
@ -7,8 +7,6 @@ import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
})
@View({
templateUrl: './demo_app.html',
directives: [MdButton, MdAnchor, NgFor],
encapsulation: ViewEncapsulation.None

4
modules/playground/src/material/checkbox/index.ts
View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, Directive, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, Directive, ViewEncapsulation} from 'angular2/core';
import {UrlResolver} from 'angular2/compiler';
import {MdCheckbox} from 'angular2_material/src/components/checkbox/checkbox';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@ -7,8 +7,6 @@ import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
})
@View({
templateUrl: './demo_app.html',
directives: [MdCheckbox],
encapsulation: ViewEncapsulation.None

14
modules/playground/src/material/dialog/index.ts
View File

@ -1,13 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {
bind,
provide,
ElementRef,
ComponentRef,
Component,
View,
ViewEncapsulation
} from 'angular2/core';
import {bind, provide, ElementRef, ComponentRef, Component, ViewEncapsulation} from 'angular2/core';
import {UrlResolver} from 'angular2/compiler';
import {
MdDialog,
@ -21,8 +13,6 @@ import {isPresent} from 'angular2/src/facade/lang';
@Component({
selector: 'demo-app',
viewProviders: [MdDialog],
})
@View({
templateUrl: './demo_app.html',
directives: [],
encapsulation: ViewEncapsulation.None,
@ -69,8 +59,6 @@ class DemoApp {
@Component({
selector: 'simple-dialog',
inputs: ['numCoconuts'],
})
@View({
encapsulation: ViewEncapsulation.None,
template: `
<h2>This is the dialog content</h2>

4
modules/playground/src/material/grid_list/index.ts
View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {MdGridList, MdGridTile} from 'angular2_material/src/components/grid_list/grid_list';
import {UrlResolver} from 'angular2/compiler';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@ -7,8 +7,6 @@ import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
})
@View({
templateUrl: './demo_app.html',
directives: [MdGridList, MdGridTile],
encapsulation: ViewEncapsulation.None,

6
modules/playground/src/material/input/index.ts
View File

@ -1,11 +1,11 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {MdInputContainer, MdInput} from 'angular2_material/src/components/input/input';
import {UrlResolver} from 'angular2/compiler';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({selector: 'demo-app'})
@View({
@Component({
selector: 'demo-app',
templateUrl: './demo_app.html',
directives: [MdInputContainer, MdInput],
encapsulation: ViewEncapsulation.None

4
modules/playground/src/material/progress-linear/index.ts
View File

@ -1,13 +1,11 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {MdProgressLinear} from 'angular2_material/src/components/progress-linear/progress_linear';
import {UrlResolver} from 'angular2/src/compiler/url_resolver';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
})
@View({
templateUrl: './demo_app.html',
directives: [MdProgressLinear],
encapsulation: ViewEncapsulation.None,

4
modules/playground/src/material/radio/index.ts
View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {UrlResolver} from 'angular2/compiler';
import {MdRadioButton, MdRadioGroup} from 'angular2_material/src/components/radio/radio_button';
import {MdRadioDispatcher} from 'angular2_material/src/components/radio/radio_dispatcher';
@ -8,8 +8,6 @@ import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
viewProviders: [MdRadioDispatcher],
})
@View({
templateUrl: './demo_app.html',
directives: [MdRadioGroup, MdRadioButton],
encapsulation: ViewEncapsulation.None,

4
modules/playground/src/material/switcher/index.ts
View File

@ -1,13 +1,11 @@
import {bootstrap} from 'angular2/bootstrap';
import {bind, provide, Component, View, ViewEncapsulation} from 'angular2/core';
import {bind, provide, Component, ViewEncapsulation} from 'angular2/core';
import {MdSwitch} from 'angular2_material/src/components/switcher/switch';
import {UrlResolver} from 'angular2/src/compiler/url_resolver';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
@Component({
selector: 'demo-app',
})
@View({
templateUrl: './demo_app.html',
directives: [MdSwitch],
encapsulation: ViewEncapsulation.None,

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

@ -9,7 +9,7 @@ import {
NgIf,
NgFor
} from 'angular2/common';
import {Component, Directive, View, Host} from 'angular2/core';
import {Component, Directive, Host} from 'angular2/core';
import {RegExpWrapper, print, isPresent} from 'angular2/src/facade/lang';
import {AbstractControl} from 'angular2/common';
@ -40,8 +40,9 @@ function creditCardValidator(c: AbstractControl): {[key: string]: boolean} {
* actual error message.
* To make it simple, we are using a simple map here.
*/
@Component({selector: 'show-error', inputs: ['controlPath: control', 'errorTypes: errors']})
@View({
@Component({
selector: 'show-error',
inputs: ['controlPath: control', 'errorTypes: errors'],
template: `
<span *ngIf="errorMessage !== null">{{errorMessage}}</span>
`,
@ -74,8 +75,9 @@ class ShowError {
}
@Component({selector: 'model-driven-forms', viewProviders: [FormBuilder]})
@View({
@Component({
selector: 'model-driven-forms',
viewProviders: [FormBuilder],
template: `
<h1>Checkout Form (Model Driven)</h1>

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

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, Directive, View, Host, forwardRef, Provider, Injectable} from 'angular2/core';
import {Component, Directive, Host, forwardRef, Provider, Injectable} from 'angular2/core';
import {NgIf, NgFor, FORM_DIRECTIVES} from 'angular2/common';
import {CONST_EXPR} from 'angular2/src/facade/lang';
@ -76,8 +76,8 @@ class DataService {
// ---- components
@Component({selector: 'full-name-cmp'})
@View({
@Component({
selector: 'full-name-cmp',
template: `
<h1>Edit Full Name</h1>
<div>
@ -107,8 +107,8 @@ class FullNameComponent {
get person(): Person { return this._service.currentPerson; }
}
@Component({selector: 'person-detail-cmp'})
@View({
@Component({
selector: 'person-detail-cmp',
template: `
<h2>{{person.fullName}}</h2>
@ -155,8 +155,8 @@ class PersonsDetailComponent {
get person(): Person { return this._service.currentPerson; }
}
@Component({selector: 'persons-cmp'})
@View({
@Component({
selector: 'persons-cmp',
template: `
<h1>FullName Demo</h1>
<div>
@ -180,8 +180,9 @@ class PersonsComponent {
}
@Component({selector: 'person-management-app', viewBindings: [DataService]})
@View({
@Component({
selector: 'person-management-app',
viewBindings: [DataService],
template: `
<button (click)="switchToEditName()">Edit Full Name</button>
<button (click)="switchToPersonList()">Person Array</button>

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

@ -1,11 +1,9 @@
import {BaseException, WrappedException} from 'angular2/src/facade/exceptions';
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
@Component({
selector: 'error-app',
})
@View({
template: `
<button class="errorButton" (click)="createError()">create error</button>`
})

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

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, Directive, View, Host, forwardRef, Provider} from 'angular2/core';
import {Component, Directive, Host, forwardRef, Provider} from 'angular2/core';
import {
ControlGroup,
NgIf,
@ -61,8 +61,9 @@ class CreditCardValidator {
* actual error message.
* To make it simple, we are using a simple map here.
*/
@Component({selector: 'show-error', inputs: ['controlPath: control', 'errorTypes: errors']})
@View({
@Component({
selector: 'show-error',
inputs: ['controlPath: control', 'errorTypes: errors'],
template: `
<span *ngIf="errorMessage !== null">{{errorMessage}}</span>
`,
@ -95,8 +96,8 @@ class ShowError {
}
@Component({selector: 'template-driven-forms'})
@View({
@Component({
selector: 'template-driven-forms',
template: `
<h1>Checkout Form</h1>

10
modules/playground/src/todo/index.ts
View File

@ -1,10 +1,14 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {NgFor} from 'angular2/common';
import {Store, Todo, TodoFactory} from './services/TodoStore';
@Component({selector: 'todo-app', viewProviders: [Store, TodoFactory]})
@View({templateUrl: 'todo.html', directives: [NgFor]})
@Component({
selector: 'todo-app',
viewProviders: [Store, TodoFactory],
templateUrl: 'todo.html',
directives: [NgFor]
})
class TodoApp {
todoEdit: Todo = null;

8
modules/playground/src/web_workers/kitchen_sink/index_common.ts
View File

@ -1,4 +1,4 @@
import {Renderer, ElementRef, Component, Directive, View, Injectable} from 'angular2/core';
import {Renderer, ElementRef, Component, Directive, Injectable} from 'angular2/core';
import {StringWrapper} from 'angular2/src/facade/lang';
// A service available to the Injector, used by the HelloCmp component.
@ -33,10 +33,8 @@ class RedDec {
selector: 'hello-app',
// These are services that would be created if a class in the component's
// template tries to inject them.
viewProviders: [GreetingService]
})
// The template for the component.
@View({
viewProviders: [GreetingService],
// The template for the component.
// Expressions in the template (like {{greeting}}) are evaluated in the
// context of the HelloCmp class below.
template: `<div class="greeting">{{greeting}} <span red>world</span>!</div>

5
modules/playground/src/web_workers/message_broker/index_common.ts
View File

@ -1,11 +1,10 @@
import {PromiseWrapper} from "angular2/src/facade/async";
import {Component, View} from "angular2/core";
import {Component} from "angular2/core";
import {ServiceMessageBrokerFactory, PRIMITIVE} from "angular2/platform/worker_app";
const ECHO_CHANNEL = "ECHO";
@Component({selector: 'app'})
@View({template: "<h1>WebWorker MessageBroker Test</h1>"})
@Component({selector: 'app', template: "<h1>WebWorker MessageBroker Test</h1>"})
export class App {
constructor(private _serviceBrokerFactory: ServiceMessageBrokerFactory) {
var broker = _serviceBrokerFactory.createMessageBroker(ECHO_CHANNEL, false);

2
modules/playground/src/web_workers/router/index_common.ts
View File

@ -1,4 +1,4 @@
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {Start} from './components/start';
import {About} from './components/about';
import {Contact} from './components/contact';

10
modules/playground/src/web_workers/todo/index_common.ts
View File

@ -1,9 +1,13 @@
import {View, Component} from 'angular2/core';
import {Component} from 'angular2/core';
import {NgFor, FORM_DIRECTIVES} from 'angular2/common';
import {Store, Todo, TodoFactory} from './services/TodoStore';
@Component({selector: 'todo-app', viewProviders: [Store, TodoFactory]})
@View({templateUrl: 'todo.html', directives: [NgFor, FORM_DIRECTIVES]})
@Component({
selector: 'todo-app',
viewProviders: [Store, TodoFactory],
templateUrl: 'todo.html',
directives: [NgFor, FORM_DIRECTIVES]
})
export class TodoApp {
todoEdit: Todo = null;
inputValue: string;

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

@ -1,9 +1,9 @@
import {bootstrap} from 'angular2/bootstrap';
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {Zippy} from './zippy';
@Component({selector: 'zippy-app'})
@View({
@Component({
selector: 'zippy-app',
template: `
<zippy (open)="pushLog('open')" (close)="pushLog('close')" title="Details">
This is some content.

1
tools/public_api_guard/public_api_spec.ts
View File

@ -546,7 +546,6 @@ const CORE = [
'var Self:SelfFactory',
'var SkipSelf:SkipSelfFactory',
'var Type:any',
'var View:ViewFactory',
'var ViewChild:ViewChildFactory',
'var ViewChildren:ViewChildrenFactory',
'var ViewQuery:QueryFactory',

6
typing_spec/basic_spec.ts
View File

@ -1,10 +1,8 @@
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
@Component({
selector: 'my-app'
})
@View({
selector: 'my-app',
template: '<h1>Hello {{ name }}</h1>'
})
// Component controller

10
typing_spec/router_spec.ts
View File

@ -1,11 +1,9 @@
import {Component, View} from 'angular2/core';
import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from 'angular2/router';
@Component({
selector: 'my-app'
})
@View({
selector: 'my-app',
template: '<h1>Hello</h1>',
})
class FooCmp {
@ -14,9 +12,7 @@ class FooCmp {
@Component({
selector: 'my-app'
})
@View({
selector: 'my-app',
template: '<h1>Hello {{ name }}</h1><router-outlet></router-outlet>',
directives: ROUTER_DIRECTIVES
})