最近有时间,学习一下angular2,根据自己的理解添加一些自己的理解,有什么不对的地方请指教,

学习的地址是https://angular.cn/

下边是分享一下我学习过程

angular2和angular1一样,都需要创建跟模块

angular1一般默认用app文件作为根模块的创建文件,创建方式如下

angular.module('app', [
'ui.router'
])

中括号内部位自己引用的第三方的一些插件或者服务。

angular2也同样需要创建根模块,创建方式发生了一点变化,创建方式如下

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser'; import { AppComponent } from './app.component'; @NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})

前三行import部分是ts的语法,引入三方的类库,angular的类不再是同一引用,使用哪一部分,需要单独的引用该部分

和angular1不同,angular1的根模块必须有且有一个,但是angular2必须有一个或多个,是可以有多个的,angular2可以添加特性模块,

angular2的模块都是带有@NgModule修饰器的类

@NgModule是一个修饰器函数,接收五个参数

declarations:这个模块引用的视图类,分为三种组件/指令/管道

exports:declarations的子模块,可用于其它模块的组件模板

imports:这个是描述你的模块所引用其他类所在的模块

providers: 服务的创建者,加入到全局服务列表中,可用于应用任何部分。

bootstrap: 指定应用的称为根组件,它是所有其它视图的宿主。只有根模块才能设置bootstrap属性。

angular1的根模块是只需要直接引用js,angular会直接自动的启用,

angular2是需要我们自己配置启动的,启动一般都是放置在项目的main.ts文件中,启动方式如下

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module'; platformBrowserDynamic().bootstrapModule(AppModule);

angular2学习--根模块的更多相关文章

  1. angular2 学习笔记 ( ngModule 模块 )

    2016-08-25, 当前版本是 RC 5. 参考 : https://angular.cn/docs/ts/latest/guide/ngmodule.html 提醒 : 这系列笔记的 " ...

  2. angular2框架搭建,angular-cli使用,angular2学习

    angular红红火火很多年了,一眨眼ng4都出来了,我也只能叹息前端的日新月异,以及感叹自己永远追赶不上时代的步伐,但是没关系,一个优秀的前端不在于他懂的无数的框架,而在于遇到问题时候懂得如何学习, ...

  3. Angular2学习笔记——NgModule

    在Angular2中一个Module指的是使用@NgModule修饰的class.@NgModule利用一个元数据对象来告诉Angular如何去编译和运行代码.一个模块内部可以包含组件.指令.管道,并 ...

  4. NG2入门 - 根模块

    根模块 app.module 建议大家先去学习angularjs官网的英雄教程后再进行后面的阅读,app.module.ts 就是ng2应用中的引导启动模块也称根模块 import { NgModul ...

  5. Angular2学习笔记2

    每个angular2应用程序默认使用app目录来创建(可以自己制定,但是eclipse插件生成的会自动使用app) 每个程序应当至少有一个angular模块即根模块.根模块使用@NgModule({} ...

  6. Node学习HTTP模块(HTTP 服务器与客户端)

    Node学习HTTP模块(HTTP 服务器与客户端) Node.js 标准库提供了 http 模块,其中封装了一个高效的 HTTP 服务器和一个简易的HTTP 客户端.http.Server 是一个基 ...

  7. Python学习--Selenium模块

    1. Python学习--Selenium模块介绍(1) 2.Python学习--Selenium模块学习(2) 其他: 1. Python学习--打码平台

  8. Python学习--Selenium模块学习(2)

    Selenium的基本操作 获取浏览器驱动寻找方式 1. 通过手动指定浏览器驱动路径2. 通过 `$PATH`环境变量找寻浏览器驱动 可参考Python学习--Selenium模块简单介绍(1) 控制 ...

  9. Spring Cloud开发实践 - 01 - 简介和根模块

    简介 使用Spring Boot的提升主要在于jar的打包形式给运维带来了很大的便利, 而Spring Cloud本身的优点不是那么明显, 相对于Dubbo而言, 可能体现在跨语言的交互性上(例如可以 ...

随机推荐

  1. [Android]使用Dagger 2依赖注入 - DI介绍(翻译)

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/5092083.html 使用Dagger 2依赖注入 - DI介 ...

  2. ViewPager与Tab结合使用

    我们有时候需要 标题页卡与ViewPager结合使用,其实原理也很简单. 不过工程中要引入android-support-design.jar 首先是布局文件 <android.support. ...

  3. SVN使用_获取某版本后改动的文件列表

    本章将讲解如何通过svn命令获取某版本后改动的所有文件 一键操作,告别svn log的繁杂对比工作. 1:安装SVN命令行工具Subversion(不是TortoiseSVN) 下载Subversio ...

  4. codegate-quals-2013-vuln100

    最近想多看看题目积累些经验, -------- 程序分析 64位,保护措施都没开 gdb-peda$ checksec CANARY : disabled FORTIFY : disabled NX ...

  5. idea缓存

    昨天idea出现了一个奇怪的问题: 项目没有按我指定的配置运行,按cmd+:可以看输出.而是运行了配置包下的test环境的配置, 先一看,test环境被初始化为资源包并且在输出目录上, 先取消(fil ...

  6. 【原】让H5页面适配移动设备全家 - 前端篇 - PPT

    7月份在部门内给设计中心的同事们带来<让H5页面适配移动设备全家 - 设计师篇 - PPT>的分享,在视觉和交互稿上提出页面适配的建议及提升页面体验的好处,促进前端和设计双方更好的合作,同 ...

  7. uva 1599 ideal path(好题)——yhx

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAABGYAAAODCAYAAAD+ZwdMAAAgAElEQVR4nOy9L8/0ypH/Pa8givGiyC

  8. BZOJ 2154: Crash的数字表格 [莫比乌斯反演]

    2154: Crash的数字表格 Time Limit: 20 Sec  Memory Limit: 259 MBSubmit: 2924  Solved: 1091[Submit][Status][ ...

  9. Java监听器

    监听器 1.概念 监听器:主要是用来监听特定对象的创建,属性的变化的!,本质上却是一个实现特定接口的普通java类! 对象分为自己创建自己使用的,和别人创建自己用的,自己创建的不需要监听,值需要取监听 ...

  10. 有关日期的函数操作用法总结,to_date(),trunc(),add_months();

    相关知识链接: Oracle trunc()函数的用法 oracle add_months函数 Oracle日期格式转换,tochar(),todate() №2:取得当前日期是一个星期中的第几天,注 ...