angular – 未捕获(承诺)：错误：无法找到加载’AchivementCompo

-Login Page
-Home Page
   |-Achievement 
   |-Task

我用auth guard来保护主页路由.在主页中有一个标题和链接,用于浏览子组件.目前,如果我点击链接,它会加载包含子组件的整个主页,
也给出了这个错误
例外：未捕获(承诺)：错误：找不到加载’AchievementComponent’的主要插座
我检查了一切,看起来是正确的,但我无法找出任何理由.

APP-routing.module.ts

..
@NgModule({
    imports:[
        RouterModule.forRoot([
            { path: 'login',component: LoginComponent },{ path: 'home',component: HomeComponent,canActivate [LoggedInGuard],children:[
                    { path: 'achievement',component:AchievementComponent },{ path: 'task',component:TaskComponent },{ path: '',redirectTo:'achievement',pathMatch:'full' }
                ]
            },redirectTo:'home',pathMatch:'full' },])
    ],exports:[
        RouterModule
    ]
})
export class AppRoutingModule { }

app.module.ts

@NgModule({
    imports: [
        BrowserModule,FormsModule,HttpModule,AppRoutingModule,AngularFireModule.initializeApp(firebaseConfig,firebaseAuthConfig),],declarations: [
        AppComponent,LoginComponent,HomeComponent,AchievementComponent,TaskComponent,providers: [
        UserService,DataService,LoggedInGuard,StorageService
    ],bootstrap: [AppComponent],})
export class AppModule { }

app.component.html文件仅包含< router-outlet>< / router-outlet>标签.

home.component.html

<div *ngIf="validUser">
    .......
    <nav>
        <a routerLink="achivement" >Achivement</a>
        <a routerLink="task" >Task</a>
    </nav>
    <router-outlet></router-outlet>
</div>

screen shots

谁能给出解决方案呢？