angular2中的基本概念

模块

模块就是提供相对独立功能的功能块,每一块聚焦一个聚焦一个特定业务领域。
模块的主要功能是导出一系列的类,函数和值供其他模块导入。
模块文件中的基本概念:

  • @NgModule装饰器
  • 装饰器修饰下的元数据概念
    • imports
    • declarations
    • exports
    • providers
    • bootstrap

@NgModule装饰器

用来为模块定义元数据。

imports

导入本模块中使用的其他模块

declarations

声明当前模块中使用的组件,管道和指令列表等,包括在本模块定义的和外部引入的。

exports

导出公共部分提供给其他模块使用

providers

提供了当前模块所使用的服务提供商

bootstrap

指明哪个组件为引导组件

组件

组件文件的结构如下:

impport {Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: '<h1>My First App</h1>'
})
export class AppComponent{ }

@Component

该装饰器会把一份元数据关联到根组件类上。

selector

为代表该组件的html元素指定简单的CSS选择器。

template

指定该组件如何渲染组件视图

双向数据绑定

如果我们希望在组件内对数据进行操作后再反馈到界面怎么处理呢?Angular2提供了一个双向数据绑定的机制。这个机制是这样的,在组件中提供成员数据变量,然后在模板中引用这个数据变量。
双向绑定后,我们通过数据成员变量就可以知道用户名和密码了,不需要在传递参数了。而成员变量的引用方式是this.成员变量

服务

@Injectable()

当 TypeScript 看到@Injectable()装饰器时,就会记下本服务的元数据。如果 Angular 需要往这个服务中注入其它依赖,就会使用这些元数据。

路由/导航

路由导航的另一个名字。路由器就是从一个视图导航到另一个视图的机制。

Angular的路由器是一个可选的外部Angular NgModule,名叫RouterModule。路由器包含了多种服务,多种指令(RouterOutletRouterLinkRouterLinkActive)和一套配置(Routes)。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 组件基础 组件用来包装特定的功能,应用程序的有序运行依赖于组件之间的协同工作。组件是angular应用的最小逻辑单...
    oWSQo阅读 1,396评论 0 0
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,991评论 19 139
  • 模板表达式“{{}}”不能引用任何全局命名空间中的成员(如:window、document等等)的原因: 我想原因...
    科研者阅读 998评论 2 4
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,523评论 25 708
  • 外面一片喧闹,我猜的。 记得两年前的平安夜,我为孩子们写了一封信。一直等到晚自习下课,班里一个人都没有的时候,偷偷...
    阿拉小仙儿阅读 234评论 0 0