angular2简述结构

1、index.html（需要在webpack中配置）
引用了my-app指令

2、main.js（需要在webpack中配置）
启动主组件（AppModule）

platformBrowserDynamic().bootstrapModule(AppModule);

3、routing.ts
定义了页面路由

const   routes: Routes =[····]
 @NgModule({
        imports: [ RouterModule.forRoot(routes,{useHash:true}) ],
        exports: [ RouterModule ]
    })  
    export class AppRoutingModule {}

4、AppModule：
其实是将所有组件和指令都聚集到一起，合并使用

@NgModule({
        imports: [ AppRoutingModule ],
        declarations: components,
        bootstrap:    [ AppComponent ],
        providers:[HttpClientService]
    })

···imports: [ AppRoutingModule],
导入其他module，其它module暴露的出的 Components、Directives、Pipes
等可以在本module的组件中被使用。比如导入CommonModule后就可以使用
NgIf、NgFor等指令
···bootstrap:[ AppComponent ],
通常是app启动的根组件，一般只有一个component。bootstrap中的组件会
自动被放入到entryComponents中

5、AppComponent ：

       @Component({
           selector: 'my-app',                          //my-app指令名称
           template: require('./app.html'),
           styles:[require('!raw-loader!less-loader!./style.less')]
       })
       export class AppComponent  {          //AppComponent  组件名称
           constructor(){}
           ngOnInit(){}
       }