相关疑难解决方法(0)

我正在构建一个angular2应用程序.

我有一个登录页面 - 只有2个输入(没有标题没有页脚没有侧栏)

当用户登录时,他应该导航到包含页眉,页脚和右侧导航栏的页面.

内页中唯一改变的是右侧内容.

我有app.component

import { Component } from '@angular/core';
import {ViewEncapsulation} from '@angular/core';

@Component({
    selector: 'pm-app',
    template: `
    <div>
        <router-outlet></router-outlet>
     </div>
     `,
     styleUrls:["app/app.component.css"],
      encapsulation: ViewEncapsulation.None
})
export class AppComponent {
    pageTitle: string = 'Acme Product Management';
}

我理解这个app.component就像母版页,您可以在其中添加页眉和页脚, <router-outlet></router-outlet>内容根据路由进行更改.

我的简单问题是如何为登录页面制作一个布局,将页眉,页脚和右栏的另一个布局设置为内页？

我写了一个名为"Customer"的模块,它有几个组件,如login,home和register.现在我创建了一个共享模块,它也有两个组件,如页眉和页脚.由于页眉和页脚将由客户模块中的所有组件共享,因此我将它们放在共享模块中.共享模块将导入到客户模块.

现在有一个路由器链接指向客户模块内的组件.那些路由器链接没有被解释为href.但是,如果我将这些页眉和页脚组件直接放在客户模块中,那么这些路由器链接就会得到解释.

我在下面列出了代码段.

共享模块文件

import { NgModule } from '@angular/core';

import { HeaderComponent } from './header/header.component';
import { FooterComponent } from './footer/footer.component';

@NgModule({
  imports: [ ],
  declarations: [ HeaderComponent, FooterComponent ],
  exports: [ HeaderComponent, FooterComponent ]
})

export class SharedModule { }

客户模块文件

import { NgModule } from '@angular/core';

import { SharedModule } from './shared/shared.module';
import { CustomerRoutingModule } from './customer-routing.module';

import { CustomerComponent } from './customer.component';
import { CustomerHomeComponent } from './home/home.component';
import { CustomerLoginComponent } from './login/login.component';
import …