我是Angular的新手 . 我正在创建一个包含两个部分的应用程序 . 第一部分将根据路线加载 . 第二秒将是一个页脚,在所有视图中都是相同的 .
index.html
<body>
<app-root>Loading...</app-root>
</body>
app-routing.module.ts
{ path: '', component: HomeComponent }
app.component.ts
import { Component } from '@angular/core';
@Component({
moduleId: module.id,
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
}
app.component.html
<router-outlet><router-outlet>
<app-footer></app-footer>
从'@ angular / core'导入;
home.component.ts
@Component({
selector: 'app-home',
templateUrl: './home.component.html'
})
export class HomeComponent { }
home.component.html
<div>
<p>Home page will come here</p>
</div>
footer.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-footer',
templateUrl: './footer.component.html'
})
export class FooterComponent {}
footer.component.html
<p>Footer will come here</p>
The screen displays this
页脚会来这里
主页将来到这里
我希望路由器插座首先渲染HomeComponent . 然后,应该加载app-footer组件 . 但是,它以相反的顺序呈现 .
我该怎么做才能使它们以正确的顺序渲染?
1 回答
您可以在https://github.com/g7bhatia/stackexample查看此唯一的应用程序文件夹内容,并按预期打印 .