|
1 | 1 | library hello_world.index; |
2 | 2 |
|
3 | 3 | import "package:angular2/bootstrap.dart" show bootstrap; |
4 | | -import "package:angular2/core.dart" |
5 | | - show ElementRef, Component, Directive, Injectable; |
6 | | -import "package:angular2/render.dart" show Renderer; |
| 4 | +import "package:angular2/angular2.dart" |
| 5 | + show Component, Directive, ElementRef, Injectable, Renderer; |
7 | 6 |
|
8 | 7 | main() { |
9 | | - // Bootstrapping only requires specifying a root component. |
10 | | - |
11 | | - // The boundary between the Angular application and the rest of the page is |
12 | | - |
13 | | - // the shadowDom of this root component. |
14 | | - |
15 | | - // The selector of the component passed in is used to find where to insert the |
16 | | - |
17 | | - // application. |
18 | | - |
19 | | - // You can use the light dom of the <hello-app> tag as temporary content (for |
20 | | - |
21 | | - // example 'Loading...') before the application is ready. |
22 | 8 | bootstrap(HelloCmp); |
23 | 9 | } |
24 | 10 |
|
25 | | -// A service available to the Injector, used by the HelloCmp component. |
26 | 11 | @Injectable() |
27 | 12 | class GreetingService { |
28 | 13 | String greeting = "hello"; |
29 | 14 | } |
30 | | -// Directives are light-weight. They don't allow new |
31 | 15 |
|
32 | | -// expression contexts (use @Component for those needs). |
33 | 16 | @Directive(selector: "[red]") |
34 | 17 | class RedDec { |
35 | | - // ElementRef is always injectable and it wraps the element on which the |
36 | | - |
37 | | - // directive was found by the compiler. |
38 | 18 | RedDec(ElementRef el, Renderer renderer) { |
39 | 19 | renderer.setElementStyle(el, "color", "red"); |
40 | 20 | } |
41 | 21 | } |
42 | | -// Angular 2.0 supports 2 basic types of directives: |
43 | | - |
44 | | -// - Component - the basic building blocks of Angular 2.0 apps. Backed by |
45 | | - |
46 | | -// ShadowDom.(http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/) |
47 | | - |
48 | | -// - Directive - add behavior to existing elements. |
49 | | - |
50 | | -// @Component is AtScript syntax to annotate the HelloCmp class as an Angular |
51 | 22 |
|
52 | | -// 2.0 component. |
53 | 23 | @Component( |
54 | 24 | selector: "hello-app", |
55 | 25 | viewProviders: const [GreetingService], |
|
0 commit comments