2016-09-23 21 views
1

Rc5からangular2の最終バージョンに移行しようとしました。私はmodule.tsとsystem.config.jsファイルを変更し、すべてのディレクティブを@ ngModule.Butに移動しましたが、今はエラーが発生していますが、このエラーの原因はどこにありますか?そしてそれを処理する方法:最終バージョンへのangular2移行で未処理の約束拒否エラー

メッセージを:

Uncaught (in promise): Error: No ErrorHandler. Is platform module (BrowserModule) included?

スタック(ブラウザのWebコンソールにあるもの):

"[email protected]http://localhost:3002/node_modules/zone.js/dist/zone.js:429:31scheduleResolveOrReject/ <@http://localhost:3002/node_modules/zone.js/dist/zone.js:465:[email protected]://localhost:3002/node_modules/zone.js/dist/zone.js:236:[email protected]://localhost:3002/node_modules/zone.js/dist/zone.js:136:[email protected]://localhost:3002/node_modules/zone.js/dist/zone.js:368:25ZoneTask/[email protected]://localhost:3002/node_modules/zone.js/dist/zone.js:308:25 "

ネットワークでは、main.js、module.js、およびすべてのコンポーネント読み込まれます。

これはmodule.tsです:

import { NgModule, ApplicationRef, ModuleWithProviders } from '@angular/core'; 
// Ahead of Time compile 
import { BrowserModule } from '@angular/platform-browser'; 
import { HttpModule, Http } from '@angular/http'; 
import { FormsModule } from '@angular/forms'; 
import { Routes, RouterModule } from '@angular/router'; 
// import { PLATFORM_DIRECTIVES, PLATFORM_PIPES, provide, enableProdMode } from '@angular/core'; 
import { enableProdMode } from '@angular/core'; 
import { MdToolbar } from '@angular2-material/toolbar'; 
import {MdButtonToggleModule} from '@angular2-material/button-toggle'; 
import { MdButton, MdAnchor } from '@angular2-material/button'; 
import {MdButtonModule} from '@angular2-material/button'; 
import {MdCheckboxModule} from '@angular2-material/checkbox'; 
import {MdRadioModule} from '@angular2-material/radio'; 
// import {SELECT_DIRECTIVES} from 'ng2-select/ng2-select'; 
import {MdSlideToggleModule} from '@angular2-material/slide-toggle'; 
import {MdSidenavModule} from '@angular2-material/sidenav'; 
import {MdListModule} from '@angular2-material/list'; 
import {MdGridListModule} from '@angular2-material/grid-list'; 
import {MdCardModule} from '@angular2-material/card'; 
import { 
    MdLiveAnnouncer, 
    MdRippleModule, 
    RtlModule, 
    PortalModule, 
    OverlayModule 
} from '@angular2-material/core'; 

import {MdIconModule} from '@angular2-material/icon'; 
import {MdProgressCircleModule} from '@angular2-material/progress-circle'; 
import { MdCheckbox } from '@angular2-material/checkbox'; 
import { MdUniqueSelectionDispatcher } from '@angular2-material/radio'; 
import { MdTab } from '@angular2-material/tabs'; 
import { MdList } from '@angular2-material/list'; 
import {MdInput} from '@angular2-material/input'; 
import { MdMenu } from '@angular2-material/menu'; 
import {MdProgressBarModule} from '@angular2-material/progress-bar'; 
import {MdInputModule} from '@angular2-material/input'; 
import {MdTabsModule} from '@angular2-material/tabs'; 
import {MdToolbarModule} from '@angular2-material/toolbar'; 
import {MdTooltipModule} from '@angular2-material/tooltip'; 
import { MdCoreModule } from '@angular2-material/core'; 
import {MdRipple} from '@angular2-material/core'; 
import {MdMenuModule} from '@angular2-material/menu'; 
import { MdIcon, MdIconRegistry } from '@angular2-material/icon'; 
import { createTemplateRenderer } from "./lib/directives/template-renderer.directive"; 
import { TranslateModule, TranslateLoader, TranslateStaticLoader, TranslateService } from 'ng2-translate/ng2-translate'; 
import { ConfigService } from './lib/services/config.service'; 
import { AuthenticationService } from './lib/services/authentication.service'; 
import { FileService } from './lib/services/file.service'; 
import { ContactsService } from './views/contacts/contacts.service'; 
import { LogService } from './lib/services/log.service'; 
import { app_Summary } from './lib/components/app_-summary/app_-summary.component'; 
import { routing, appRoutingProviders } from './routing'; 
import { app_App } from './lib/components/app_-app/app_-app.component'; 
import { app_Select } from "./lib/components/app_-select/app_-select.component"; 
import { ContactsView } from './views/contacts/contacts'; 
import { GroupsView } from './views/groups/groups'; 
import { app__COMPONENTS } from "./lib/components/app_-components.module"; 
import { app__DIRECTIVES } from "./lib/directives/app_-directives"; 
import { app__PIPES } from "./lib/pipes/app_-pipes"; 
import { app_Field } from "./lib/components/app_-field/app_-field.component"; 
import { app_Title } from './lib/components/app_-title/app_-title.component'; 
import { app_Tab } from './lib/components/app_-tab/app_-tab.component'; 
import { XHRBackend } from "@angular/http"; 
import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api'; 
import { InMemoryDataService } from './lib/services/in-memory-data.service'; 
import { app_Action } from './lib/components/app_-action/app_-action.component'; 
import { app_ActionsMenu } from './lib/components/app_-actions-menu/app_-actions-menu.component'; 
import { app_Pane } from './lib/components/app_-pane/app_-pane.component'; 
import {MATERIAL_DIRECTIVES, MATERIAL_PROVIDERS} from 'ng2-material'; 
import { MdDialog } from "ng2-material/components/dialog/dialog"; 
const MATERIAL_MODULES = [ 
    MdButtonModule, 
    MdButtonToggleModule, 
    MdCardModule, 
    MdCheckboxModule, 
    MdGridListModule, 
    MdIconModule, 
    MdInputModule, 
    MdListModule, 
    MdMenuModule, 
    MdProgressBarModule, 
    MdProgressCircleModule, 
    MdRadioModule, 
    MdRippleModule, 
    MdSidenavModule, 
    //MdSliderModule, 
    MdSlideToggleModule, 
    MdTabsModule, 
    MdToolbarModule, 
    MdTooltipModule, 
    OverlayModule, 
    PortalModule, 
    RtlModule, 
]; 
@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    // MATERIAL_MODULES, 
    MdButtonModule.forRoot(), 
    MdCardModule.forRoot(), 
    MdCheckboxModule.forRoot(), 
    MdGridListModule.forRoot(), 
    MdInputModule.forRoot(), 
    MdListModule.forRoot(), 
    MdProgressBarModule.forRoot(), 
    MdProgressCircleModule.forRoot(), 
    MdRippleModule.forRoot(), 
    MdSidenavModule.forRoot(), 
    MdTabsModule.forRoot(), 
    MdToolbarModule.forRoot(), 
    PortalModule.forRoot(), 
    RtlModule.forRoot(), 
    MdButtonToggleModule.forRoot(), 
    MdIconModule.forRoot(), 
    MdMenuModule.forRoot(), 
    MdRadioModule.forRoot(), 
    MdSlideToggleModule.forRoot(), 
    MdTooltipModule.forRoot(), 
    OverlayModule.forRoot(), 
    RouterModule, 
    routing, 
    TranslateModule.forRoot({ 
    provide: TranslateLoader, 
    useFactory: (http: Http) => new TranslateStaticLoader(http, '/app/i18n', '.json'), 
     deps: [Http] 
    }) 
    ], 

    exports: [ 
    MATERIAL_MODULES, 
    TranslateModule 
    ], 

    providers: [ 
    appRoutingProviders, 
    MdLiveAnnouncer, 
    TranslateService, 
    ConfigService, 
    LogService, 
    AuthenticationService, 
    ContactsService, 
    FileService, 
    ], 

    declarations: [ 
    app_App, 
    app__COMPONENTS, 
    app__DIRECTIVES, 
    app__PIPES, 
    ContactsView, 
    GroupsView, 
    MdIcon, 
    MdButton, 
    MdInput, 
    MdTab, 
    MdList, 
    MdCheckbox, 
    MdMenu, 
    app_Field, 
    createTemplateRenderer("item", "index"), 
    MdToolbar, 
    MdDialog, 
    app_Select, 
    app_Title, 
    app_Tab, 
    app_Summary, 
    app_Action, 
    app_ActionsMenu, 
    MdRadioModule, 
    app_Pane, 
    ], 

    entryComponents: [ 
    App 
    ], 
    bootstrap: [App] 
}) 

export class MaterialRootModule { } 
@NgModule({ 
    imports: MATERIAL_MODULES, 
    exports: MATERIAL_MODULES, 
}) 

export class AppModule{ 
    static forRoot(): ModuleWithProviders { 
    return { ngModule: MaterialRootModule }; 
    } 
} 

と、これはindex.htmlにある:

<head> 
    <base href="/"> 
    <title>MEMS</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link rel="stylesheet" href="app/css/ui-layout.css"> 
    <link rel="stylesheet" href="node_modules/@angular2-material/core/overlay/overlay.css"> 
    <link rel="stylesheet" href="node_modules/ng2-material/ng2-material.css"> 
    <link rel="stylesheet" href="node_modules/ng2-material/font/font.css"> 
    <link rel="stylesheet" href="node_modules/ng2-select/components/css/ng2-select.css"> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
    <script src="//cdn.auth0.com/js/lock-8.1.min.js"></script> 
    <script src="node_modules/es6-shim/es6-shim.min.js"></script> 
    <script src="node_modules/zone.js/dist/zone.js"></script> 
    <script src="node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="node_modules/systemjs/dist/system.src.js"></script> 
    <script src="app/js/base64-arraybuffer.js"></script> 
    <script src="app/js/ui.js"></script> 
    <script src="systemjs.config.js"></script> 
    <script> 
    System.import('app/main').catch(function(err){ console.error(err); }); 
    </script> 
</head> 
<body> 
    <app>Loading ...</app> 
</body> 
</html> 

あなたは私を助けてくださいますか?

多くのありがとうございます。

+0

'@ NgModule'と' index.html'を表示します。 – micronyks

+0

質問を更新し、index.htmlとmodule.tsを追加しました。 a –

+0

これはWebコンソールで見ることができるメッセージです。エラー:未知(約束):Error:No ErrorHandler。プラットフォームモジュール(BrowserModule)は含まれていますか? –

答えて

1

私の問題は私のmodule.jsのせいでした。私はいくつかの時間前に同じエラーメッセージを持っていた{}

// ngDoBootstrap() { 

    // this._appRef.bootstrap(SeiApp); 

    // } 

    // static forRoot(): ModuleWithProviders { 

    // return { ngModule: MaterialRootModule }; 

    // } ` 
+0

それはどういう意味ですか?この問題を解決するためにモジュールをどのように変更しましたか? –

+0

@VladimirMelekhあなたは私の答えをチェックすることができます。 –

1

: は、私は(ApplicationRefプライベート_appRef) `//コンストラクタを削除しました。問題は私のカスタムErrorHandlerに関連していました。カスタムErrorHandlerがapp.module.tsの最後に追加されました。このカスタムErrorHandlerをこのページの先頭に移動する必要があります。私はangular2のwebpackを使用しています。

関連する問題