angular2-ionic2
angular2-ionic2 copied to clipboard
semlinker
Angular & Ionic 资料汇总
**搭建开发环境** 环境安装 1.Windows 平台 ``` npm install -g cordova ionic # 安装ant # 系统环境变量中配置android sdk路径 ``` 2.iOS 平台 ``` sudo npm install -g cordova ionic sudo npm install -g ios-sim...
在 Angular 2 学习过程中，相信很多初学者对 constructor 和 ngOnInit 的应用场景和区别会存在困惑，本文我们会通过实际的例子，为读者一步步解开困惑。 constructor 在 ES6 中就引入了类，constructor(构造函数) 是类中的特殊方法，主要用来做初始化操作，在进行类实例化操作时，会被自动调用。马上来个例子： class AppComponent { constructor(name) { console.log('Constructor initialization'); this.name = name; } } let appCmp = new AppComponent('AppCmp');...
Angular 2 TemplateRef & ViewContainerRef TemplateRef 在介绍 TemplateRef 前，我们先来了解一下 HTML [模板元素](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/template) - 。模板元素是一种机制，允许包含加载页面时不渲染，但又可以随后通过 JavaScript 进行实例化的客户端内容。我们可以将模板视作为存储在页面上稍后使用的一小段内容。 在 HTML5 标准引入 template 模板元素之前，我们都是使用 标签进行客户端模板的定义，具体如下： I am span in mock template 对于支持 HTML5 template...
在介绍 Angular 2 ViewEncapsulation 之前，我们先来介绍一下 [Web Components](https://developer.mozilla.org/zh-CN/docs/Web/Web_Components) 标准。 Web Components 近年来，web 开发者们通过插件或者模块的形式在网上分享自己的代码，便于其他开发者们复用这些优秀的代码。同样的故事不断发生，人们不断的复用 JavaScript 文件，然后是 CSS 文件，当然还有 HTML 片段。但是你又必须祈祷这些引入的代码不会影响到你的网站或者web app。 WebComponents 是解决这类问题最好的良药，它通过一种标准化的非侵入的方式封装一个组件，每个组件能组织好它自身的 HTML 结构、CSS 样式、JavaScript 代码，并且不会干扰页面上的其他元素。 Web Components 由以下四种技术组成： - [Custom...
Angular 2 的口号是 - "一套框架，多种平台。同时适用手机与桌面(One framework.Mobile & desktop.)"，即 Angular 2 是支持开发跨平台的应用，比如：Web应用、移动Web应用、原生移动应用和原生桌面应用等。 为了能够支持跨平台，Angular 2 通过抽象层封装了不同平台的差异，统一了 API 接口。如定义了抽象类 Renderer 、抽象类 RootRenderer 等。此外还定义了以下引用类型：ElementRef、TemplateRef、ViewRef 、ComponentRef 和 ViewContainerRef 等。下面我们就来分析一下 ElementRef 类： ElementRef 的作用 在应用层直接操作 DOM，就会造成应用层与渲染层之间强耦合，导致我们的应用无法运行在不同环境，如...
Inject 装饰器的作用 在 Angular 2 中，Inject 是参数装饰器，用来在类的构造函数中描述非 Type 类型的依赖对象。 Angular 2 中 Type 类型： // Type类型 - @angular/core/src/type.ts export const Type = Function; export function isType(v: any): v is Type...
Angular 2 中 Pipe(管道) 与 Angular 1.x 中的 filter(过滤器) 的作用的是一样的。它们都是用来对输入的数据进行处理，如大小写转换、数值和日期格式化等。  Angular 2 内建管道 AsyncPipe、CurrencyPipe、DatePipe、DecimalPipe、I18nPluralPipe、I18nSelectPipe、 JsonPipe、LowerCasePipe、PercentPipe、SlicePipe、TitleCasePipe、UpperCasePipe Angular 2 内建管道使用示例 1.大写转换 {{ 'Angular' | uppercase }} {{ 'Angular' | uppercase }}...
在 Angular 2 Decorators part -1 和 part -2 文章中，我们介绍了 Decorator 的分类和 Angular 2 常见的内置装饰器，并且我们深入分析了 ComponentDecorator 内部工作原理。此外，我们还发现在 TypeDecorator 类装饰器内部，使用了 Reflect 对象提供的 getOwnMetadata 和 defineMetadata 方法，实现 metadata 信息的读取和保存。具体可参照下图：  Angular 2...
在 [Angular 2 Decorators - part 1 ](https://github.com/semlinker/angular2-ionic2/issues/9) 文章中，我们介绍了 TypeScript 中的四种装饰器。本文的主要目的是介绍 Angular 2 中常见的内置装饰器。Angular 2 内置装饰器分类： - 类装饰器 - @Component、@NgModule、@Pipe、@Injectable - 属性装饰器 - @Input、@Output、@ContentChild、@ContentChildren、@ViewChild、@ViewChildren - 方法装饰器 - @HostListener - 参数装饰器...