Я делаю проект в angular6. Я создал компонент верхнего и нижнего колонтитула.
И когда я использую селектор <app-header> и <app-footer> в app.component.html, он будет работать нормально. Но если я буду использовать этот селектор в другом компоненте, он не будет показывать верхний и нижний колонтитулы. Я включил эти компоненты в файл app.module.ts. Может кто-нибудь дать какие-либо предложения по решению этой проблемы.
login.component.html
<app-header></header>
<app-footer></app-footer>
Мне нужно отобразить верхний и нижний колонтитулы на странице входа. Но это не работает.
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { CustomMaterialModule } from './material.module';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { ContactUsComponent } from './contact-us/contact-us.component';
import { AboutUsComponent } from './about-us/about-us.component';
import { LoginComponent } from './login/login.component';
import { UserComponent } from './user/user.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { DashboardComponent } from './dashboard/dashboard.component';
import { NotificationComponent } from './notification/notification.component';
import { SendMessageComponent } from './send-message/send-message.component';
import { DashboardRoutingModule } from './dashboard/dashboard-routing.module';
import { NotesComponent } from './notes/notes.component';
import { PopupComponent } from './popup/popup.component';
import { MyDialogComponent } from './my-dialog/my-dialog.component';
import { MatDialogModule,MatButtonModule, MatToolbarModule, MatGridListModule,MatCardModule,MatSidenavModule, MatIconModule, MatListModule } from '@angular/material';
import {MatSelectModule} from '@angular/material/select';
import { LogoutComponent } from './logout/logout.component';
import { MainNavComponent } from './main-nav/main-nav.component';
import { LayoutModule } from '@angular/cdk/layout';
import { FooterComponent } from './footer/footer.component';
import { HeaderComponent } from './header/header.component';
@NgModule({
declarations: [
AppComponent,
HomeComponent,
ContactUsComponent,
AboutUsComponent,
LoginComponent,
UserComponent,
DashboardComponent,
NotificationComponent,
SendMessageComponent,
NotesComponent,
PopupComponent,
MyDialogComponent,
LogoutComponent,
MainNavComponent,
FooterComponent,
HeaderComponent
],
imports: [
BrowserModule,
AppRoutingModule,
CustomMaterialModule,
FormsModule,
BrowserAnimationsModule,
DashboardRoutingModule,
MatDialogModule,
MatButtonModule,
ReactiveFormsModule,
MatSelectModule,
LayoutModule,
MatToolbarModule,
MatSidenavModule,
MatIconModule,
MatListModule,
MatCardModule,
MatGridListModule
],
entryComponents: [
MyDialogComponent
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }