angular 日常积累

disabled span和a

由于span和a没有disabled的属性，所以不能通过绑定属性disabled来设置

1. 添加disabled样式，pointer-events使点击事件不响应

//.CSS
.disable
{
    opacity: 0.2;
    pointer-events: none;
}

2通过样式绑定

<a [class.disable] = "isDisable_addbeam"></a>

form自定义validator

这个可能会报错

//.ts
FractionNumberAsyncValidator = (control: FormControl) =>{
                if (!control.value) {
                    return { error: true, required: true };
                }
                if (control.value < this.completedSessionNum) {
                   return { error: true };
                }
}

异步

//ts
  userNameAsyncValidator = (control: FormControl) =>
    new Observable((observer: Observer<ValidationErrors | null>) => {
      setTimeout(() => {
        if (control.value === 'JasonWood') {
          // you have to return `{error: true}` to mark it as an error event
          observer.next({ error: true, duplicated: true });
        } else {
          observer.next(null);
        }
        observer.complete();
      }, 1000);
    });

.ts
this.beamGroupForm = this.fb.group({
fractions: ['', [Validators.required], [this.FractionNumberAsyncValidator]],
})