我正在尝试使用侧边栏和router-outlet
将居住的主要舞台区域设置我的布局。我想让我的侧边栏成为一个可以保存导航的组件,但是我遇到了一个问题,因为现在我的菜单不起作用,如果我不使用组件并直接添加我的菜单,则菜单有效主AppComponent
,但那不是我想做的。这就是我所拥有的:
sidebar.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-sidebar',
template: `<div class="main-nav">
<ul class="vertical-menu">
<li>
<a routerLink="notes" routerLinkActive="is-active">Notes</a>
</li>
<li>
<a routerLink="goals" routerLinkActive="is-active">Goals</a>
</li>
</ul>
</div>`
})
export class SidebarComponent { }
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-startup-science',
template: `<app-sidebar></app-sidebar>
<router-outlet></router-outlet>`
})
export class AppComponent { }
app.routes.ts
import { Routes } from '@angular/router';
// Components
import { AppComponent } from './containers/app.component';
export const routes: Routes = [
{ path: 'app', component: AppComponent },
];