angular: RC.5 problem about combining @NgModule with

First of all,I want to say I read the document in official website,and I try to simulate it in my project but failed. Here’s my code structure.

app.routes.ts

import {provideRouter, RouterConfig, RouterModule} from '@angular/router';
import {wechatRoutes} from "./wechat/wechat.routes";


export const routes:RouterConfig = [
    ...wechatRoutes,
    {path: '', redirectTo: '/wechat'}
];

export const appRouting = RouterModule.forRoot(routes);

app.module.ts

import {NgModule}       from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {AppComponent}   from './app.cpn';
import {routes, appRouting} from './app.routes.ts';
import {LocationStrategy, HashLocationStrategy} from '@angular/common';
import {WechatModule} from "./wechat/wechat.module";


@NgModule({
    imports: [
        BrowserModule,
        appRouting
    ],
    declarations: [
        AppComponent
    ],
    providers: [
        {provide: LocationStrategy, useClass: HashLocationStrategy}
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
} 

app.cpn.ts

import {Component, OnInit} from '@angular/core';
import {Router, ROUTER_DIRECTIVES} from '@angular/router';


@Component({
    selector: '.app',
    template: `
    <router-outlet></router-outlet>
    `
})
export class AppComponent {

    constructor(private router:Router) {
    }
}

wechat.module.ts

import {NgModule}           from '@angular/core';
import {HttpModule}           from '@angular/http';
import {FormsModule}           from '@angular/forms';
import {WechatCenterComponent} from "./wechat-center.cpnt";
import {wechatRouting} from "./wechat.routes";
import {BrowserModule} from '@angular/platform-browser';
import {AutoReplyComponent} from "./auto-reply/auto-reply.cpnt";
import {AutoReplyService} from "./auto-reply/auto-reply.svc";
import {ChatComponent} from "./chat/chat.cpnt";
import {ImageMessageDirective} from "./chat/image-message.drt";
import {FollowerService} from "./follower/follower.svc";
import {ChatService} from "./chat/chat.svc";
import {FollowerComponent} from "./follower/follower.cpnt";
import {MenuComponent} from "./menu/menu.cpnt";


@NgModule({
    imports: [BrowserModule, FormsModule, HttpModule, wechatRouting],
    declarations: [ImageMessageDirective, WechatCenterComponent, MenuComponent, ChatComponent, FollowerComponent, AutoReplyComponent],
    providers: [AutoReplyService, ChatService, FollowerService]
})
export class WechatModule {
}

wechat.routes.ts

import {RouterConfig, RouterModule} from "@angular/router";
import {WechatCenterComponent} from "./wechat-center.cpnt";
import {ChatComponent} from "./chat/chat.cpnt.ts";
import {MenuComponent} from "./menu/menu.cpnt";
import {AutoReplyComponent} from "./auto-reply/auto-reply.cpnt.ts";


export const wechatRoutes:RouterConfig = [
    {
        path: 'wechat',
        component: WechatCenterComponent,
        children: [
            {
                path: 'chat',
                component: ChatComponent
            },
            {
                path: 'menu',
                component: MenuComponent
            },
            {
                path: 'auto-reply',
                component: AutoReplyComponent
            },
            {
                path: '',
                component: AutoReplyComponent
            }
        ]
    }
];

export const wechatRouting = RouterModule.forChild(wechatRoutes);

wechat-center.cpnt.ts

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router';


@Component({
    selector: '.wechat-center',
    template: `
    <!--<h2 class="text-center">微信公众平台</h2>-->
    <div>
        <div id="menu-container">
            <ul class="menu vertical no-bullet">
                <!--<li><a [routerLink]="['/wechat/follower']">Follower</a></li>-->
                <li><a [routerLink]="['/wechat/chat']">Chat</a></li>
                <li><a [routerLink]="['/wechat/auto-reply']">Auto Reply</a></li>
                <!--<li><a [routerLink]="['/wechat/menu']">Menu</a></li>-->
            </ul>
        </div>
        <div id="wechat-container">
            <router-outlet></router-outlet>
        </div>
    </div>
  `,
    directives: [ROUTER_DIRECTIVES]
})
export class WechatCenterComponent {

    constructor() {
    }
}

I am confusing about whether should I imports WechatModule in the AppModule, but whether I import or not,it doesn’t work.