关键字：提供商(providers)、指令结构写法、抽象类Validatorjavascript

下面经过自定义表单验证器代码拆分讲解html

const UUID_VALIDATOR: any = {
  provide: NG_VALIDATORS,
  useExisting: forwardRef(() => UUIDValidator),
  multi: true
};

@Directive({
  selector: '[uuid][formControlName],[uuid][formControl],[uuid][ngModel]',
  providers: [UUID_VALIDATOR]
})
export class UUIDValidator implements Validator, OnInit, OnChanges {
  @Input() uuid;

  private validator: ValidatorFn;
  private onChange: () => void;

  ngOnInit() {
    this.validator = uuid(this.uuid);
  }

  ngOnChanges(changes: SimpleChanges) {
    for (const key in changes) {
      if (key === 'uuid') {
        this.validator = uuid(changes[key].currentValue);
        if (this.onChange) {
          this.onChange();
        }
      }
    }
  }

  validate(c: AbstractControl): {[key: string]: any} {
    return this.validator(c);
  }

  registerOnValidatorChange(fn: () => void): void {
    this.onChange = fn;
  }
}

周日补充java

Forward Referencelinux

自定义验证指令 @Attribute() 指令扩展用法

掌握Angular2的依赖注入 useExisting useClass usevale等别名注入

Angular 2 Multi Providerssegmentfault

Angular2 依赖注入之实例化过程windows

[][]估计是要都存在的状况下指令才生效缓存

关键字：aot编译报错、linux网络

这是window下aot编译angular项目（ng build）出现的警告，警告事后仍能够正常打包。app

公司运维在linux环境经过jenkies工具自动化打包这个警告就变成报错，缘由是linux严格区分大小写，而windows不区分。运维

出现这种状况是由于对于第三方的UI库进行扩展的时候，把文件直接拷贝出来进行修改，一旦UI库维护更新了文件名称如大小变成小写，拷贝的代码仍是大写路径。

关键字：路由复用

项目遇到一种需求，表格数据量大的时候在表格内部确定会出现滚动条，如今想在切换路由的时候保证表格内部滚动条原封不动的在那个位置。目前想到的仅仅是识别内部距顶位置做为记录，每次切换再滚动一遍。

先说说路由复用解决的问题：

后台系统本质是解决不一样路由页切换时组件数据不丢失问题（减小网络请求）
入场动画或路由动画不会屡次触发（组件及其状态经过路由快照被保存起来，组件不会再次实例化/初始化，生命周期也不会从新触发）
符合tab页组件的切换

一句话归纳，angular经过路由策略使用<router-outlet>做为容器加载/渲染不一样的页面组件，此处的组件应该是一个ng-template的壳装载，经过路由复用策略五个方法（抽象类）去进行路由复用，替换->缓存->重用就是总体的核心了

五个方法

shouldDetach 直接返回 true 表示对全部路由容许复用
store 当路由离开时会触发。按path做为key存储路由快照&组件当前实例对象；path等同RouterModule.forRoot中的配置。
shouldAttach 若 path 在缓存中有的都认为容许还原路由
retrieve 从缓存中获取快照，若无则返回null
shouldReuseRoute 进入路由触发，判断是否同一路由

angular路由复用组件参考ng-alain

关键字：模块预加载(PreloadingStrategy)的控制和实现(https://blog.csdn.net/happykala/article/details/77945000)

(1)preloadingStrategy: PreloadAllModules——使用angular内置的加载策略一次性预加载全部的模块，也就是对应的工厂函数文件，以便于跳转到指定模块会实例化对应的组件

(2)自定义预加载策略（自行在路由配置那些须要预加载），无预加载的模块会在进入的时候才会加载，提升首次进入的速度

import {Route,PreloadingStrategy } from '@angular/router';
import { Observable } from 'rxjs';
import 'rxjs/add/observable/of';
/**
 * 自定义的路由加载策略，在定义中定义data其中的属性preload为真的时候这个模块蔡须要被预先加载
 */
export class CustomPreloadingStrategy implements PreloadingStrategy{
    preload(route: Route, fn: () => Observable<any>): Observable<any>{
        return route.data&&route.data.preload?fn():Observable.of(null);
    }
}

Angular平常记录（会用还不够，关键理解）

自定义验证指令 @Attribute() 指令扩展用法

掌握Angular2的依赖注入 useExisting useClass usevale等别名注入