Angular 2 Output

2017-03-22
阅读 8 分钟
25.7k
Output 是属性装饰器,用来定义组件内的输出属性。在 Angular 2 Input 文章中,我们介绍了 Input 装饰器的作用,也了解了当应用启动时,Angular 会从根组件开始启动,并解析整棵组件树,数据由上而下流下下一级子组件。而我们今天介绍的 Output 装饰器,是用来实现子组件将信息通过事件的形式通知到父级组件。具体如下图...

Angular 2 Input

2017-03-21
阅读 5 分钟
22.9k
Input 是属性装饰器,用来定义组件内的输入属性。在实际应用场合,我们主要用来实现父组件向子组件传递数据。Angular 应用是由各式各样的组件组成,当应用启动时,Angular 会从根组件开始启动,并解析整棵组件树,数据由上而下流下下一级子组件。

Angular 2 AsyncPipe

2017-03-20
阅读 10 分钟
18.5k
今天我们来介绍一下 Angular 2 中 AsyncPipe (异步管道) ,使用 AsyncPipe 我们可以直接在模板中使用 Promise 和 Observable 对象,而不用通过定义一个类的成员属性来存储返回的结果。

Angular 2 Change Detection - 2

2017-03-19
阅读 12 分钟
29.3k
如你所知,Angular 2 应用程序是一颗组件树,而每个组件都有自己的变化检测器,这意味着应用程序也是一颗变化检测器树。顺便说一句,你可能会想。是由谁来生成变化检测器?这是个好问题,它们是由代码生成。 Angular 2 编译器为每个组件自动创建变化检测器,而且最终生成的这些代码 JavaScript VM友好代码。这也是为什么...

Angular 2 Change Detection - 1

2017-03-19
阅读 7 分钟
16k
Change Detection (变化检测) 是 Angular 2 中最重要的一个特性。当组件中的数据发生变化的时候,Angular 2 能检测到数据变化并自动刷新视图反映出相应的变化。

Angular 2 JIT vs AOT

2017-03-17
阅读 6 分钟
18.9k
在 Angular 应用程序中,包含了我们通过 Angular 提供的 API 实现的自定义指令。这些自定义指令对浏览器来说,都是无法识别的,因此每个 Angular 应用程序在运行前,都需要经历一个编译的阶段。

Angular 2 Directive Lifecycle

2017-03-16
阅读 9 分钟
14.7k
在介绍 Angular 2 Directive Lifecycle (生命周期) 之前,我们先来介绍一下 Angular 2 中 Directive (指令) 与 Component (组件) 的关系。

Angular 2 ContentChild & ContentChildren

2017-03-15
阅读 7 分钟
18.9k
前面的文章我们已经介绍过了 Angular 2 的 ViewChild & ViewChildren 属性装饰器,现在我们就来介绍一下它们的兄弟 ContentChild 和 ContentChildren 属性装饰器。我想通过一个简单的需求,来引入我们今天的主题。具体需求如下:

Angular 2 ViewChild & ViewChildren

2017-03-14
阅读 7 分钟
54.5k
ViewChild 是属性装饰器,用来从模板视图中获取匹配的元素。视图查询在 ngAfterViewInit 钩子函数调用前完成,因此在 ngAfterViewInit 钩子函数中,就能正确获取查询的元素。

Angular 2 constructor & ngOnInit

2017-03-14
阅读 4 分钟
21.1k
在 Angular 2 学习过程中,相信很多初学者对 constructor 和 ngOnInit 的应用场景和区别会存在困惑,本文我们会通过实际的例子,为读者一步步解开困惑。

Angular 2 ViewEncapsulation

2017-03-13
阅读 4 分钟
18.6k
近年来,web 开发者们通过插件或者模块的形式在网上分享自己的代码,便于其他开发者们复用这些优秀的代码。同样的故事不断发生,人们不断的复用 JavaScript 文件,然后是 CSS 文件,当然还有 HTML 片段。但是你又必须祈祷这些引入的代码不会影响到你的网站或者web app。

Angular 2 TemplateRef & ViewContainerRef

2017-03-13
阅读 8 分钟
31.1k
在介绍 TemplateRef 前,我们先来了解一下 HTML 模板元素 - <template> 。模板元素是一种机制,允许包含加载页面时不渲染,但又可以随后通过 JavaScript 进行实例化的客户端内容。我们可以将模板视作为存储在页面上稍后使用的一小段内容。

Angular 4 ElementRef

2017-03-11
阅读 6 分钟
50.2k
Angular 的口号是 - "一套框架,多种平台。同时适用手机与桌面 (One framework.Mobile & desktop.)",即 Angular 是支持开发跨平台的应用,比如:Web 应用、移动 Web 应用、原生移动应用和原生桌面应用等。

Angular 2 Pipe

2017-03-10
阅读 7 分钟
31.1k
Angular 2 中 Pipe(管道) 与 Angular 1.x 中的 filter(过滤器) 的作用的是一样的。它们都是用来对输入的数据进行处理,如大小写转换、数值和日期格式化等。

Angular 2 Inject

2017-03-09
阅读 9 分钟
13.9k
(更新时间 - 2017-03-20 9:00) Inject 装饰器的作用 在 Angular 2 中,Inject 是参数装饰器,用来在类的构造函数中描述非 Type 类型的参数对象。 Angular 2 中 Type 类型: {代码...} Angular 2 中常用的非 Type 类型 Token:字符串、OpaqueToken对象、InjectionToken对象等。 {代码...} (备注:各种 Token 类型的区别...

基于 Ionic 2 多主题、多租户构建方案探索

2017-03-09
阅读 6 分钟
5.9k
公司的产品是一款2B的在线教育产品,已有的客户大多数都有定制化的需求,主要包括UI主题和二次开发的功能。本文围绕的主要内容是如何基于 Ionic 2 平台提供的工具,实现灵活的多主题方案。

Angular 2 DI - IoC & DI - 1

2017-03-09
阅读 6 分钟
15.4k
Ioc - Inversion of Control , 即"控制反转"。在开发中, IoC 意味着你设计好的对象交给容器控制,而不是使用传统的方式,在对象内部直接控制。  

Angular 2 Decorators - 3

2017-03-09
阅读 3 分钟
5.6k
在 Angular 2 Decorators part -1 和 part -2 文章中,我们介绍了 Decorator 的分类和 Angular 2 常见的内置装饰器,并且我们深入分析了 ComponentDecorator 内部工作原理。此外,我们还发现在 TypeDecorator 类装饰器内部,使用了 Reflect 对象提供的 getOwnMetadata 和 defineMetadata 方法,实现 metadata 信息的读取...

Angular 2 Decorators - 2

2017-03-09
阅读 8 分钟
9.7k
在 Angular 2 Decorators - part 1 文章中,我们介绍了 TypeScript 中的四种装饰器。本文的主要目的是介绍 Angular 2 中常见的内置装饰器。Angular 2 内置装饰器分类:

Angular 2 Decorators - 1

2017-03-09
阅读 5 分钟
9.6k
在我们深入了解 Angular 2 中 @NgModule、@Component、@Injectable 等常见的装饰器之前,我们要先了解 TypeScript 中的装饰器。装饰器是一个非常酷的特性,最早出现在 Google 的 AtScript 中,它出现的目的是为了让开发者,开发出更容易维护、更容易理解的 Angular 代码。令人兴奋的是,在2015年 Angular 团队跟 MicroSo...

Angular 2 OpaqueToken & InjectionToken

2017-03-09
阅读 4 分钟
13.5k
在 Angular 2 中,provider 的 token 的类型可以是字符串或 Type 类型。我们可以根据实际应用场景,选用不同的类型。假设我们有一个服务类 DataService,并且我们想要在组件中注入该类的实例,我们可以这样使用:

Angular 2 Forward Reference

2017-03-09
阅读 5 分钟
14k
Angular 2 通过引入 forwardRef 让我们可以在使用构造注入时,使用尚未定义的依赖对象类型。下面我们先看一下如果没有使用 forwardRef ,在开发中可能会遇到的问题:

Angular 2 Multi Providers

2017-03-09
阅读 4 分钟
13.9k
上面例子中,我们使用 multi: true 告诉 Angular 2的依赖注入系统,我们设置的 provider 是 multi provider。正如之前所说,我们可以使用相同的 token 值,注册不同的 provide。当我们使用对应的 token 去获取依赖项时,我们获取的是已注册的依赖对象列表。

Angular 2 Provider

2017-03-09
阅读 4 分钟
19.9k
在 Angular 2 中我们使用 Provider 来描述与 Token 关联的依赖对象的创建方式。Angular 2 中依赖对象的创建方式有四种,它们分别是:

Angular 2 Directive

2017-03-09
阅读 7 分钟
24.6k
Angular 2 的指令分为以下三种: 组件(Component directive):用于构建UI组件,继承于 Directive 类 属性指令(Attribute directive): 用于改变组件的外观或行为 结构指令(Structural directive): 用于动态添加或删除DOM元素来改变DOM布局 Angular 2 组件 组件示例: {代码...} Angular 2 内置属性指令 1.ngStyle指令: ...

Angular 4.x template syntax & common directives

2017-03-09
阅读 8 分钟
17k
阅读 Angular 6/RxJS 最新教程,请访问前端修仙之路 模板语法简介 插值表达式 {代码...} 等价于 {代码...} 模板表达式 属性绑定 输入属性的值为常量 {代码...} 等价于 {代码...} 输入属性的值为实例属性 {代码...} 等价于 {代码...} 事件绑定 {代码...} 等价于 {代码...} 模板引用变量 {代码...} 等价于 {代码...} 双向...