Тип "LocationComponent" входит в состав объявлений 2 модулей: Angular 6? - PullRequest
Новая
       19

Тип "LocationComponent" входит в состав объявлений 2 модулей: Angular 6?

0 голосов
/ 11 сентября 2018

Я совершенно новичок в angular, поэтому не могу решить свою ошибку, используя другие ответы стекового потока.Пожалуйста, помогите.

Я использую угловой 6. У меня уже есть базовый формат, поэтому я пытаюсь добавить дочернюю страницу.Но я получил эту ошибку 'Тип LocationComponent является частью объявлений 2 модулей' и застрял в нем около 2 дней.

Вот изображение формата папки My src: My src folder:

Мои app.module.ts кодируются следующим образом: 

import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CommonModule, LocationStrategy, HashLocationStrategy } from '@angular/common';
import { NgModule, NgModuleFactory } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { Routes, RouterModule } from '@angular/router';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { LocationComponent } from './masterpage/location/location.component';
import { StorageComponent } from './masterpage/storage/storage.component';
@NgModule({
  declarations: [
    AppComponent,
    SpinnerComponent,         
    LocationComponent,
    StorageComponent
  ],
  imports: [
    CommonModule,
    BrowserModule,
    BrowserAnimationsModule,   
    FormsModule,
    HttpClientModule,
    NgbModule.forRoot(),      
    AppRoutingModule,        
  ],
  providers: [
      {
      provide: PERFECT_SCROLLBAR_CONFIG,
      useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG
    },{
    provide: LocationStrategy,
    useClass: HashLocationStrategy
  }],
  bootstrap: [AppComponent]
})
export class AppModule { }

Мой app-routing.module.ts выглядит следующим образом: 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
export const routes: Routes = [
{
    path: '',
    component: FullComponent,
    children: [
        { path: '', redirectTo: '/masterpage/location', pathMatch: 'full' },
        { path: 'masterpage', loadChildren: './masterpage/masterpage.module#MasterPageModule' }, 
    ]
}];
@NgModule({
    imports: [RouterModule.forRoot(routes), NgbModule.forRoot()],
    exports: [RouterModule]
})
export class AppRoutingModule { }

Мои коды masterpage.module.ts выглядят следующим образом: 

import { NgModule,Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { LocationComponent } from './location/location.component';
import { StorageComponent } from './storage/storage.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { MasterPageRoutes } from './masterpage.routing';

@NgModule({
    imports: [
        FormsModule,
        CommonModule,
        NgbModule,
        RouterModule.forChild(MasterPageRoutes)
    ],
    declarations: [
        LocationComponent,
        StorageComponent,
    ]
})
export class MasterPageModule { }

Ниже приведены коды моей masterpage.routing.ts: 

import { Routes } from '@angular/router';
import { LocationComponent } from './location/location.component';
import { StorageComponent } from './storage/storage.component';

export const MasterPageRoutes: Routes = [
  {
    path: '',
    children: [
    {
      path: 'location',
      component: LocationComponent,
      data: {
        title: 'Location',
        urls: [{title: 'Location',url: '/location'},{title: 'Location'}]
      }
    }, {
      path: 'storage',
      component: StorageComponent,
      data: {
        title: 'Storage',
        urls: [{title: 'Storage',url: '/storage'},{title: 'Storage'}]
      }
    }
]
  }
];

Мой пример, ранее запущенный с URL '/ localhost: 4200 / # / dashboard / dashboard1' - это был пример.Я изменил панель управления в соответствии с моим запросом как «masterpage» и ее дочерние элементы «dashboard1» и «dashboard2» на «location» и «storage» соответственно.Я хочу, чтобы местоположение дочерних страниц и хранилище должны были загружаться с помощью URL '/ localhost: 4200 / # / masterpage / location' Но это не работает для меня.Нет ошибки в кодовой странице.Ошибка, которую я обнаружил в консоли только при проверке элементов.

Пожалуйста, помогите мне, что в ней не так .. Заранее спасибо.

1 Ответ

0 голосов
/ 11 сентября 2018

Поскольку вы уже объявили LocationComponent в app.module.ts, он уже доступен для всего приложения. Таким образом, нет необходимости объявлять его снова в masterpage.module.ts .

Удалите LocationComponent в masterpage.module.ts из массива объявлений, а также избавьтесь от импорта.

...