Angular7学习笔记

组件学习

FormGroup

Angular中的表单，在Ts引入组件

import {FormBuilder, FormGroup, Validators} from '@angular/forms';

FormBuilder用来构建表单，构建方法如下。
第一步，先创建对象

validateForm: FormGroup;

第二步：构建，在这里可以为每个字段设置不同的约束，如下

this.validateForm = this.fb.group({
        startTime: [null, [Validators.required]],
        endTime: [null, [Validators.required]],
        id: [null],
        userId: [null],
        enable: [null, [Validators.required]]
      }
    );

下面是一个自定义控件，用于确认密码，保证密码和确认密码的一致性

  confirmationValidator = (control: FormControl): { [s: string]: boolean } => {
    if (!control.value) {
      return {required: true};
    } else if (control.value !== this.validateForm.controls.passwords.value) {
      return {confirm: true, error: true};
    }
    return {};
  }
this.validateForm = this.fb.group({
      oldPassword: [null, [Validators.required]],
      password: [null, [Validators.required, this.confirmationValidator]],
      passwords: [null, [Validators.required]],
    });

想取表单里的值用

this.appLogoUrl = this.validateForm.getRawValue().appLogoUrl;