angular4 form表单初始化

import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormControl, FormGroup, ValidationErrors, Validators} from '@angular/forms';
import {MarketStaffService} from '../../../../@core/data/system/market-staff.service';
import {MessageService} from '../../../../@core/utils/message.service';
import {Observable} from 'rxjs/Observable';
import {ErrorMessage} from '../../../../@core/ui/valid-error/valid-error.component';
import { ActivatedRoute, Router,Params, ActivatedRouteSnapshot, RouterState, RouterStateSnapshot } from '@angular/router';

@Component({
  selector: 'ngx-market-staff-add',
  templateUrl: './market-staff-add.component.html',
  styleUrls: ['./market-staff-add.component.scss'],
  providers: [MarketStaffService, MessageService],
})
export class MarketStaffAddComponent implements OnInit {

  constructor(private fb: FormBuilder, private staffService: MarketStaffService, private msg: MessageService,
              public router: Router,) {   }

  ngOnInit() {
    this.form.addControl('who',new FormControl('卢克'));
    this.form.addControl('business',this.marketStaff);
    console.log('添加后',this.form);
  }
  marketStaff: FormGroup = this.fb.group({
    cloudUser: ['0001'],
    loginName: ['', [Validators.required, Validators.pattern(/^[a-zA-Z][a-zA-Z0-9_-]{5,32}$/)], this.loginNameExists.bind(this)],
    telephone: ['', [Validators.required, Validators.pattern(/^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))d{8}$/)]],
    userName: ['', [Validators.required, Validators.maxLength(64)]],
    email: ['', [Validators.email]],
    position: ['', [Validators.required]],
  });
  form: FormGroup = this.fb.group({
    test: this.fb.array([

    ]),
    marketStaff: this.marketStaff,
    code: ['', [Validators.required, Validators.pattern(/^[0-9]{4}$/)], this.validCode.bind(this) ],
  });


}

  

FormGroup 的详细讲解地址：

https://www.angular.cn/api/forms/FormGroup#registercontrol

标颜色出用了

addControl()方法 这个写法可表单里面动态添加属性