web-dev-qa-db-ja.com

Angular 2.0予期しない値 '[オブジェクトオブジェクト]'モジュールによってインポートされました 'AppModule'

angular 2.0アプリケーションをロードしようとすると、次のエラーが発生します:(インデックス）：21エラー：エラー：モジュール 'AppModule'によってインポートされた予期しない値 '[オブジェクトオブジェクト]'

import { ModuleWithProviders }  from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { searchComponent }      from './search.Component'; 
import { landingComponent }     from './landing.Component'; 

export const routes: Routes = [
{
    path: '',
    component: searchComponent
},
{
    path: 'search',
    component: searchComponent
}];
export const routedComponents = [searchComponent, landingComponent];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);

AppModule

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { HttpModule }    from '@angular/http';
import { landingComponent }              from './landing.Component'; 
import { searchComponent }               from './search.Component'; 
import { routes, routedComponents }      from './app.routing';
import { homeScript }                    from './Services/homeScript';

@NgModule({
imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routes
],
declarations: [
    landingComponent,
    searchComponent,
    routedComponents
],
providers: [
    homeScript
],
bootstrap: [landingComponent]

})
export class AppModule { }

起動用のスクリプトを入力します

///<reference path="./../typings/globals/core-js/index.d.ts"/>
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './appModule';

platformBrowserDynamic().bootstrapModule(AppModule)
  .then(success => console.log(`Bootstrap success`))
  .catch(error => console.log('GUY  ' + error));

インポートから「ルート」を削除すると、ランディングページが読み込まれますが、エラーは発生しません。 AppModuleで「ルート」を削除すると、ランディングページが正しく読み込まれるため、ルーティングにエラーがあると思われます。多くの変更を試みましたが、問題の原因を特定できませんでした。どんな助けでもいただければ幸いです。

angulartypescriptangular2-modules
7
Guy Gallant

問題は、宣言の一部としてroutedComponentsを設定することです。これはディレクティブ、コンポーネント、またはパイプではないため、この例外が発生します。 routedComponentsをモジュールから削除しますdeclarations配列とそれはあなたの問題を解決します。

11
galvan

インポート配列から「ルート」を削除し、それに「ルーティング」を追加するだけです。

imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routing
]
3
MAN
  app.menurouting.ts
export  const menurouting:Routes=[{path:'',redirectTo:'menu',pathMatch:'full'},
          {path:'restarenttype',component:RestaurantTypeComponentComponent},
           {path:'table',component:TablelayoutComponent},
          {path:'blog',component:ViewmenuComponent},
        ];
        export  const routes:ModuleWithProviders=RouterModule.forRoot(menurouting)

    app.module.ts

    import {routes} from './app.menurouting';

    @NgModule({
      declarations: [
        AppComponent,
        LoginComponentComponent,
        TablelayoutComponent,
        ViewmenuComponent,
        RestaurantTypeComponentComponent
      ],
      imports: [
        BrowserModule,
        routes
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }
0
sudheer nunna