angular2.0 进修笔记

### 1.angular-cli 常用敕令纪录

细致教程
angular cli官网 有，这里不细致申明,感兴趣的能够自行到官网看，一下仅纪录本人到进修历程常用到的敕令

1.建立项目 ng new

  ng new project-name 

  exp:
  ng new my-app

2.启动项目 ng serve

3.建立module

  ng generate module module-name

  // 简写：
  ng g m moduleName

  // 新建带对应路由的module
  ng generate module my-module-name --routing

  // 简写 
  ng g m my-module --routing

  // 搜检建立时搜检module是不是存在
  ng g m my-module --spec

4.建立 component

  ng generate component component-name (options)

  // 简写
  ng g c component-name

  // options exp 
  // 在src/app 目次下天生component-name 组件
  ng g c component-name --flat true 

以下是components options申明

5.建立指令 ng directive

  ng generate directive my-directive (options)

  // 简写
  ng g d my-directive

  // options exp 
  // 在src/app 目次下天生 my-directive 指令
  ng g d my-directive --flat true 

ng directive 指令 options 参数 申明

6.建立service

  ng generate service service-name (options)

  // 简写
  ng g s service-name

ng service options 申明

7.构建 ng build

  ng build

  // 设置 输出文件位置 为 myDist 文件夹
  ng build --output-path myDist

2.angular(简称ng) 笔记 一下

此笔记不会从0到1解说，仅做为纪录本人进修angular2.x以上版本到进修笔记，若有题目能够发问，愿望我遇到到题目能够协助到你到进修，若有统统不邃晓到题目，请移步到
angular官方文档 或
angular中文文档 检察更细致的申明

因为本人原先是运用vuejs和reactjs为主，所以有许多时刻都是以vue作为对照例子邃晓，若有说得不清晰的，迎接提bug。

1. ng 架构 主要由4大部份构成

2.模块
ng的模块，邃晓起来跟我之前邃晓的模块还真不一样。ng模块须要经由过程NgModule去定义，而且ng的模块在我的邃晓概念上是一个相对自力的集合体，模块声明了当前模块运用到的相干组件、指令、管道、效劳和一些编译设置。对照与vue的组件邃晓，ng模块显得略为有点贫苦，但也更加清晰的表达了模块和组件的关联，组件和模块不是一个意义。vue的模块，更多时刻是vue工程已帮开辟者处置惩罚好了，不必本身去定义模块，只须要关注组件营业开辟即可。固然，vue的组件也是须要注册到vue对象内里到，能够在全局注册，也能够注册到当前运用到组件，在组件注册这里，vue和ng都是一样须要手动注册。

  import {NgModule} from '@angular/core';
  import {BrowserModule} from '@angular/platform-browser';
  @NgModule({
    imports: [BrowserModule], // 本模块须要注入的其他模块‘
    /*
    * export
    * 本模块导出的组件、指令、管道，假如其他模块引入了本模块，在其他模块能够直接运用本模块输出的组件、指令和管道
    */
    exports: [],
    // providers本模块向全局效劳中孝敬的效劳建立器，本人临时也不知道是啥，后期研讨邃晓了再零丁写一篇补上吧
    providers: [Logger], 
    // bootstrap 指定了本模块启动时，应当启动的组件
    bootstrap: [],
    // id 模块ID,用于运用getModuleFactory辨别模块
    id: 'myApp'
  })
  export class AppModule {}

以上注解有部份借鉴于
石头皮的ANGULAR2_NGMODULE模块详解

3.组件
ng的组件，就是但存的组件，跟vue的组件是相似的东西。只不过ng的组件须要@Component装潢器定义一些组件设置，包含 selector, template/templateUrl, providers, styles/styleUrls等。然后组件保安有模版、指令、数据绑定、管道(filter)、事宜/属性绑定、

4.效劳与依靠注入
这个实在与angularjs差异不大，效劳照样能够用于组件之间的数据通讯，注入让效劳更天真，须要时注入。

5.路由
定义导航的划定规矩，而且把导航与组件或module关联起来。