refactor(core): change module semantics

This contains major changes to the compiler, bootstrap of the platforms
and test environment initialization.

Main part of #10043
Closes #10164

BREAKING CHANGE:
- Semantics and name of `@AppModule` (now `@NgModule`) changed quite a bit.
  This is actually not breaking as `@AppModules` were not part of rc.4.
  We will have detailed docs on `@NgModule` separately.
- `coreLoadAndBootstrap` and `coreBootstrap` can't be used any more (without migration support).
  Use `bootstrapModule` / `bootstrapModuleFactory` instead.
- All Components listed in routes have to be part of the `declarations` of an NgModule.
  Either directly on the bootstrap module / lazy loaded module, or in an NgModule imported by them.

modules/playground/src/web_workers/message_broker/index.ts

@@ -6,17 +6,17 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ApplicationRef} from '@angular/core';
+import {PlatformRef} from '@angular/core';
 import {UiArguments, FnArg, PRIMITIVE, ClientMessageBrokerFactory} from '@angular/platform-browser';
 import {bootstrapWorkerUi} from "@angular/platform-browser-dynamic";
 
 const ECHO_CHANNEL = "ECHO";
 
 export function main() {
-  bootstrapWorkerUi("loader.js").then((ref) => afterBootstrap(ref));
+  bootstrapWorkerUi("loader.js").then(afterBootstrap);
 }
 
-function afterBootstrap(ref: ApplicationRef) {
+function afterBootstrap(ref: PlatformRef) {
   let brokerFactory: ClientMessageBrokerFactory = ref.injector.get(ClientMessageBrokerFactory);
   var broker = brokerFactory.createMessageBroker(ECHO_CHANNEL, false);
 

modules/playground/src/web_workers/router/background_index.ts

@@ -6,17 +6,11 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {provideRouter} from '@angular/router';
-import {WORKER_APP_LOCATION_PROVIDERS} from '@angular/platform-browser';
-import {bootstrapWorkerApp} from '@angular/platform-browser-dynamic';
+import {workerAppDynamicPlatform} from '@angular/platform-browser-dynamic';
+import {bootstrapModule} from '@angular/core';
 
-import {HashLocationStrategy, LocationStrategy} from '@angular/common';
-import {App, ROUTES} from './index_common';
+import {AppModule} from './index_common';
 
 export function main() {
-  bootstrapWorkerApp(App, [
-    provideRouter(ROUTES),
-    WORKER_APP_LOCATION_PROVIDERS,
-    {provide: LocationStrategy, useClass: HashLocationStrategy}
-  ]);
+  bootstrapModule(AppModule, workerAppDynamicPlatform());
 }

modules/playground/src/web_workers/router/index_common.ts

@@ -6,13 +6,15 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {Component} from '@angular/core';
+import {Component, NgModule, ApplicationRef} from '@angular/core';
 import {Start} from './components/start';
 import {About} from './components/about';
 import {Contact} from './components/contact';
-import {ROUTER_DIRECTIVES, Router} from '@angular/router';
+import {Router, RouterModule, provideRoutes} from '@angular/router';
+import {WorkerAppModule, WORKER_APP_LOCATION_PROVIDERS} from '@angular/platform-browser';
+import {HashLocationStrategy, LocationStrategy} from '@angular/common';
 
-@Component({selector: 'app', directives: [ROUTER_DIRECTIVES], templateUrl: 'app.html'})
+@Component({selector: 'app', templateUrl: 'app.html'})
 export class App {
   constructor(router: Router) {
     // this should not be required once web worker bootstrap method can use modules
@@ -24,4 +26,18 @@ export const ROUTES = [
   {path: '', component: Start},
   {path: 'contact', component: Contact},
   {path: 'about', component: About}
-];
+];
+
+@NgModule({
+  imports: [WorkerAppModule, RouterModule],
+  providers: [provideRoutes(ROUTES), WORKER_APP_LOCATION_PROVIDERS, {provide: LocationStrategy, useClass: HashLocationStrategy}],
+  precompile: [App],
+  declarations: [App, Start, Contact, About]
+})
+export class AppModule {
+  constructor(appRef: ApplicationRef) {
+    appRef.waitForAsyncInitializers().then( () => {
+      appRef.bootstrap(App);
+    });
+  }
+}