我想建立一个通过URL路由不同页面的网站。但是,组件的背景已渲染,并且比app.html的mainbackground缩小了px。它与Renderer2一起工作了一点,但与此同时,我无法包含我的CSS文件。
There are also two scrollingbars
component.html (如果我只是设置黑色背景的话)
<div style="background:black; height: 100vh">Hello</div>
component.ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-engineering',
templateUrl: './engineering.component.html',
styleUrls: ['./engineering.component.css']
})
export class EngineeringComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
css为空
app.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { NotfoundComponent } from './notfound/notfound.component';
import { IndexComponent } from './index/index.component';
import { EngineeringComponent } from './engineering/engineering.component';
@NgModule({
declarations: [
AppComponent,
NotfoundComponent,
EngineeringComponent,
IndexComponent
],
imports: [
BrowserModule,
HttpClientModule,
RouterModule.forRoot([
{
path: 'engineering',
component: EngineeringComponent
}, {
path: 'index',
component: IndexComponent
}, {
path: '',
redirectTo: '/index',
pathMatch: 'full' ,
}, {
path: '**',
component: NotfoundComponent
},
])
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
template: '<router-outlet></router-outlet>',
})
export class AppComponent {
title = 'Angular';
}