@@ -8,7 +8,7 @@ include ../_util-fns
88 :marked
99 Read more in the ["RC5 and NgModules" announcement](https://angularjs.blogspot.com).
1010
11- Learn the details of NgModule in the [Angular Module](../guide/ngmodule) chapter.
11+ Learn the details of NgModule in the [Angular Module](../guide/ngmodule.html ) chapter.
1212:marked
1313 The new `@NgModule` decorator gives you module-level components, directives, and pipes without
1414 the need to specify them repeatedly in every component of your application.
@@ -44,25 +44,31 @@ include ../_util-fns
4444 Check out the upgrade in [one commit](https://github.com/StephenFluin/ngmodule-migration/commit/9f9c6ae099346e491fc31d77bf65ed440e1f164c).
4545
4646 ## 1. Update to RC5
47- If you use npm, you should be able to either update your package.json file and run npm install.
47+ If you use npm, you should be able to either update your ` package.json` file and run ` npm install` .
4848 Or alternatively you can run the following command:
4949
50- ```bash
51- npm install @angular/{core,common,compiler,angular-cli,platform-browser,platform-browser-dynamic}@2.0.0-rc.5 --save
52- ```
50+ code-example( format ='.' language ='bash' ) .
51+ npm install @angular/{core, common, compiler, platform-browser, platform-browser-dynamic} --save
5352
54- You should also update any libraries you are using
53+ :marked
54+ Update your optional libraries
5555
56- ``` bash
57- npm install @angular/router@3.0.0-rc.1
58- npm install @angular/forms@1.0.0-rc.1
56+ code-example ( format = '.' language = ' bash' ) .
57+ npm install @angular/router
58+ npm install @angular/forms
5959 npm install @angular2-material/{button,card,toolbar,etc}@experimental
60- ```
6160
62- ## 2. Create an NgModule
61+ :marked
62+ Update the Angular CLI if you're using that tool
63+
64+ code-example( format ='.' language ='bash' ) .
65+ npm install @angular/angular-cli @angular/tsc-wrapped --save-dev
66+
67+ :marked
68+ ## 2. Create an _NgModule_
6369 Create a new file called app.module.ts. Populate it with your root component as follows:
6470
65- ``` javascript
71+ code-example ( format = '.' language = ' javascript' ) .
6672 import { NgModule } from '@angular/core';
6773 import { BrowserModule } from '@angular/platform-browser';
6874 import { AppComponent } from './app.component';
@@ -73,24 +79,23 @@ include ../_util-fns
7379 bootstrap: [AppComponent],
7480 })
7581 export class AppModule {}
76- ```
77-
7882
83+ :marked
7984 ## 3. Update your bootstrap
80- Update your `main.ts` file to bootstrap using the Just in Time compiler.
85+ Update your `main.ts` file to bootstrap using the " Just in Time" (JIT) compiler.
8186
82- ``` javascript
87+ code-example ( format = '.' language = ' javascript' ) .
8388 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
8489 import { AppModule } from './app/app.module';
8590
8691 platformBrowserDynamic().bootstrapModule(AppModule);
87- ```
8892
89- ## 4. Update your 3rd party libraries
90- Remove any 3rd party libraries from you AppComponent’s providers.
91- You’ll want to move these to your NgModule’s imports, while updating to use each library’s provided Module(s).
93+ :marked
94+ ## 4. Import library modules in your _NgModule_
95+ Remove the Angular and 3rd party library providers from your `AppComponent` providers
96+ and switch to `NgModule` imports as seen in this example.
9297
93- ``` javascript
98+ code-example ( format = '.' language = ' javascript' ) .
9499 imports: [
95100 BrowserModule,
96101 // Router
@@ -104,16 +109,18 @@ include ../_util-fns
104109 MdCardModule,
105110 MdInputModule,
106111 ],
107- ```
108112
113+ :marked
109114 ## 5. Cleanup
110- As of RC5, we allow you to leave `directives` and `pipes` in your `@Component` decorators.
111- In fact, we automatically hoist (add) them to the NgModule that they belong to.
115+ For RC5, you can leave your components, directives and pipes
116+ in the `directives` and `pipes` properties of your `@Component` metadata.
117+ In fact, we automatically hoist (add) them to the NgModule to which they belong.
112118
113119.alert.is-important
114120 :marked
115- This behavior is provided temporarily for backward compatibility. It will soon be removed.
121+ This option is temporary for backward compatibility.
122+ It will be removed in the final release of Angular 2.0.
116123
117- Stay ahead of this deprecation by removing them from your components and placing them into your `NgModule` declarations
118- as soon as possible.
119- : marked
124+ Get ahead of the game and start moving your component `directives` and `pipes`
125+ into module `declarations` as soon as possible.
126+ We intend to delete _all_ deprecated class, methods, and properties in the next RC.
0 commit comments