각도 2 웹 작업자 - UI가 실행되지 않음

Question

웹 근로자에서 실행중인 angular2 응용 프로그램이 있습니다. 그 모습으로 모든 것이 예상대로 실행되고 있지만 DOM에서는 아무 것도 일어나지 않는 것 같습니다. 예를 들어, 앱이로드되는 동안 프리 로더를 표시하지만 실제 애플리케이션 UI로 바뀌지는 않습니다.

<my-app>Loading...</my-app> 

는 AppModule로드, 아무것도 ... 나는 ... 전체 응용 프로그램이 잘 실행되고 내 모든 구성 요소와 서비스가 나는 배경 작업자 내에서 예상하는대로 정확하게 실행을 참조에도 내 인앱 렌더링없는 경우 - UI가 없습니다. 나는 webworker를 사용하지 않을 때 내가 기대하는 것처럼 내 webworker-main.ts에서

UI_THREAD_CHANNEL = 'UI_THREAD_CHANNEL' 
bootstrapWorkerUi('/webworker-loader.js').then((hWnd) => { 

       // register methods the WebWorker needs to run on the UI thread. 
       let brokerFactory: ServiceMessageBrokerFactory = hWnd.injector.get(ServiceMessageBrokerFactory); 
       let broker = brokerFactory.createMessageBroker(UI_THREAD_CHANNEL, false); 

       broker.registerMethod('redirect', [PRIMITIVE], (href: string) => { 
        window.location.href = href; 
       }); 
      }); 

내 main.ts에서

import { NgModule } from '@angular/core'; 
import { HttpModule, XSRFStrategy } from '@angular/http'; 
import { FormsModule } from '@angular/forms'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { WorkerAppModule } from '@angular/platform-webworker'; 
import { WORKER_APP_LOCATION_PROVIDERS } from '@angular/platform-webworker'; 

import { AppComponent } from './app.component'; 
import { NoXSRFStrategy } from './common/backends/XSRFStrategies'; 

@NgModule({ 
    imports: [ 
     BrowserModule, 
     HttpModule, 
     FormsModule, 
     routing, 

     WorkerAppModule   
    ], 
    declarations: [ 
     AppComponent 
    ], 
    providers: [ 
     { provide: XSRFStrategy, useClass: NoXSRFStrategy }, 

     WORKER_APP_LOCATION_PROVIDERS   
    ], 
    bootstrap: [AppComponent] 
}) 
export class AppModule {  
    constructor() { }  
} 

import { platformWorkerAppDynamic } from '@angular/platform-webworker-dynamic'; 
import { AppModule } from './app.module'; 
const platform = platformWorkerAppDynamic(); 
platform.bootstrapModule(AppModule); 

모든 작동합니다. 나는 내가 믿는이 일을하는 것에 정말로 가깝다. 내가 놓친 것을 발견 할 수 없다. 내가로드하지 않은 것 또는 라우팅과 관련이없는 것을 알고 있습니다.

Answer 1

알아 냈습니다.

문제는 main.ts의 bootstrapWorkerUi, 특히 @ angular/platform-webworker의 WORKER_UI_LOCATION_PROVIDERS에 추가 공급자를 제공해야한다는 것입니다.

새로운 (작업) main.ts

import { WORKER_UI_LOCATION_PROVIDERS, bootstrapWorkerUi, 
ServiceMessageBrokerFactory } from '@angular/platform-webworker'; 

UI_THREAD_CHANNEL = 'UI_THREAD_CHANNEL' 
bootstrapWorkerUi('/webworker-loader.js', WORKER_UI_LOCATION_PROVIDERS).then((hWnd) => { 

    // register methods the WebWorker needs to run on the UI thread. 
    let brokerFactory: ServiceMessageBrokerFactory = hWnd.injector.get(ServiceMessageBrokerFactory); 
    let broker = brokerFactory.createMessageBroker(UI_THREAD_CHANNEL, false); 

    broker.registerMethod('redirect', [PRIMITIVE], (href: string) => { 
     window.location.href = href; 
    }); 
});