TypeScript FormBuilder.control方法代码示例

  ngOnInit() {

    this.usuario = new UsuarioModel();
    this.usuario.nome = 'b';
    this.usuario.username = '';
    this.usuario.email = '';

    this.usuarioForm = this.formBuilder.group({
      nome: this.formBuilder.control(this.usuario.nome),
      email: this.formBuilder.control(this.usuario.email),
      username: this.formBuilder.control(this.usuario.username),
      // password: this.formBuilder.control('', [
      //   Validators.required,
      //   Validators.minLength(1)
      // ]),
      // consfirm: this.formBuilder.control('', [
      //   Validators.required,
      //   Validators.minLength(1)
      // ]),
    });


    let idUsuario: string = '';
    if (
      this.activatedRoute.snapshot.paramMap.get('id') != null &&
      this.activatedRoute.snapshot.paramMap.get('id') != undefined
    ) {
      idUsuario = this.activatedRoute.snapshot.paramMap.get('id');

      this.usuarioService.getUsuario(idUsuario).subscribe(data => {
        this.usuario = data.data;
      });
    }
  }

 ngOnInit(): void {
   this.email = this.formBuilder.control('', Validators.email);
   this.password = this.formBuilder.control('', Validators.required);
   this.formGroup = this.formBuilder.group({
     email: ['', Validators.email],
     password: ['', Validators.required]
   });
 }

 constructor(private ts: TimeSpecService, fb: FormBuilder, private _router: Router, private _route: ActivatedRoute) {
   this.begin    = fb.control('', null);  // XXX date validators
   this.end      = fb.control('', null);  // XXX date validators
   this.duration = fb.control('', durationValidator);
   this.stepsize = fb.control('', durationValidator);
   this.formModel = fb.group({
     begin: this.begin,
     end: this.end,
     duration: this.duration,
     stepsize: this.stepsize,
   });
 }

    it('should create control arrays', () => {
      const c = b.control('three');
      const e = b.control(null);
      const f = b.control(undefined);
      const a = b.array(
          ['one', ['two', syncValidator], c, b.array(['four']), e, f], syncValidator,
          asyncValidator);

      expect(a.value).toEqual(['one', 'two', 'three', ['four'], null, null]);
      expect(a.validator).toBe(syncValidator);
      expect(a.asyncValidator).toBe(asyncValidator);
    });

    /**
     * Add the form control for the search mode.
     *
     * @param {string} fieldName Control field name.
     * @param {any}    value     Initial set value.
     */
    protected addControl(fieldName: string, value?: any): void {
        if (!this.form) {
            return;
        }

        if (this.mode == 'search') {
            this.form.addControl(fieldName, this.fb.control(this.search[fieldName] || null));
        }

        if (this.mode == 'edit') {
            this.form.addControl(fieldName, this.fb.control(value, this.field.required ? Validators.required : null));
        }
    }

 ngOnInit() {
   this.email = this.formBuilder.control('', Validators.email);
   this.password = this.formBuilder.control('', Validators.compose(
     [Validators.minLength(8), CustomValidators.passwordComplexity]));
   this.passwordConfirmation = this.formBuilder.control('');
   this.form = this.formBuilder.group({
     email: this.email,
     password: this.password,
     passwordConfirmation: this.passwordConfirmation
   }, {
     validator: CustomValidators.confirmPassword()
   });
 }

        it('should set updateOn with complex setup', () => {
          const g = b.group({
            group: b.group(
                {one: b.control('', {updateOn: 'change'}), two: b.control('')}, {updateOn: 'blur'}),
            groupTwo: b.group({one: b.control('')}, {updateOn: 'submit'}),
            three: b.control('')
          });

          expect(g.get('group.one') !.updateOn).toEqual('change');
          expect(g.get('group.two') !.updateOn).toEqual('blur');
          expect(g.get('groupTwo.one') !.updateOn).toEqual('submit');
          expect(g.get('three') !.updateOn).toEqual('change');
        });

  function updateForm(name, description, birthdate) {
    if (!component.personForm) {
      component.personForm = formBuilder.group({
        Name: formBuilder.control({}),
        Description: formBuilder.control({}),
        BirthDate: formBuilder.control({}),
      });
    }

    component.personForm.controls['Name'].setValue(name);
    component.personForm.controls['Description'].setValue(description);
    component.personForm.controls['BirthDate'].setValue(birthdate);
  }

 this.clubs.map((club: Club) => {
   const clubControl: FormControl = this.fb.control(club);
   const nameControl: FormControl = this.fb.control(club.clubName, [
     Validators.required,
     Validators.minLength(3),
     Validators.maxLength(250),
     this.existingClubName()
   ]);
   const group: FormGroup = this.fb.group({
     name: nameControl,
     club: clubControl
   });
   newClubsArray.push(group);
 });

 public ngOnInit() {
   this.translate.setDefaultLang('en');
   this.translate.use('en');
   this.loginForm = this.fb.group({
     name: this.fb.control('', [
       Validators.required,
       Validators.minLength(3),
       Validators.maxLength(250)
     ]),
     password: this.fb.control('', [
       Validators.required,
       Validators.minLength(8),
       Validators.maxLength(250)
     ])
   });
 }