现状 最近在重构手上的一个 Angular 项目,之前是用的自己写的一个仿 Elm 架构的库来进行的状态管理,期间遇到了这些痛点: 样板代码太多 异步处理太过繁琐 需要单独维护一个 npm 包 其中,一.二两点是促使我重构的原因,第三点是促使我更换状态管理方案的理由(太懒了,根本不想去维护这个项目). 样板代码太多 Elm 架构中,有下面几个重要的概念: Message(在 Redux 中被称作 Action) Update(在 Redux 中被称作 Reducer) Model 这三个概念用…
一 Subject主题 Subject是Observable的子类.- Subject是多播的,允许将值多播给多个观察者.普通的 Observable 是单播的. 在 Subject 的内部,subscribe 不会调用发送值的新执行.它只是将给定的观察者注册到观察者列表中,类似于其他库或语言中的 addListener 的工作方式. 要给 Subject 提供新值,只要调用 next(theValue),它会将值多播给已注册监听该 Subject 的观察者们. import { Compone…
When a Todo property updates, you still must create a new Array of Todos and assign a new reference. This lesson walks you through refactoring from the current approach to the immutable approach. TodoItemRender.ts: import {Component, Input, ViewEncap…
const stores = Immutable.List([ { name: 'Store42', position: { latitude: 61.45, longitude: 23.11, }, address: 'whatever' }, { name: 'Store2', position: { latitude: 61.48, longitude: 23.87 }, address: 'whatever' }, { name: 'Store3', position: { latitu…
Angular 4.x 快速入门 Angular 4 快速入门 涉及 Angular 简介.环境搭建.插件表达式.自定义组件.表单模块.Http 模块等 Angular 4 基础教程 涉及 Angular CLI 使用.创建组件.事件.自定义服务. ngFor 指令.Input.Output 装饰器等 Angular 4 指令快速入门 涉及如何创建指令.定义输入属性.事件处理.如何获取宿主元素属性值.如何创建结构指令等 Angular 4 表单快速入门 涉及如何创建表单.表单验证.表单控件状态.…
本文转自:https://loiane.com/2017/08/angular-hide-navbar-login-page/ In this article we will learn two approaches to hide the Navbar Menu when displaying the Login page in Angular projects. Update December 2017: code updated to Angular v5 and Material v5.…
In this article I will talk in depth about the Angular 2 change detection system. HIGH-LEVEL OVERVIEW An Angular 2 application is a tree of components. An Angular 2 application is a reactive system, with change detection being the core of it. Every c…
1.在angular 2中,回调函数的返回结果,不会自动更新视图层的显示,可以用 ChangeDetectorRef 来驱动angular更新视图. import {ChangeDetectorRef} from "angular2/core"; //引入ChangeDetectorRef定义 constructor(public changeDetectorRef:ChangeDetectorRef) { //注入当前组件的ChangeDetectore this.cd = cd;…
在Angular+ionic2 开发过程中,我们不难发现,页面之间跳转之后返回时是不会刷新数据的. 场景一:当前页面需要登录之后才能获取数据--去登录,登录成功之后返回--页面需要手动刷新才能获取到数据. 场景二:当前正在浏览地址列表--选择添加或者更改现有地址,保存成功之后--返回列表,页面数据不是最新的数据. -- 实现需求:一旦用户登录成功,列表数据发生变化--就通知相关的组件,主动去获取最新的数据. 类似的场景有很多,在Angular开发中我们就需要使用Subject来实现组件之间的通信…
angular里面变化检测是非常频繁的发生的,如果你像下面这样写代码 <div> {{hello()}} </div> 则每次变化检测都会执行hello函数,如果hello函数十分耗时,则会出现占用CPU高的问题. 这时,推荐使用OnPush策略和immutable.js来提升angular应用的性能. OnPush策略可以阻止angular变化检测传入组件,这样每次变化检测不会进到你的组件里面来调用hello函数. 引入immutable.js的作用是为了更加方便的使用OnPus…