Question

我有一个添加用户的功能模型是：

export class User {
  public constructor (
    public firstName: string,
    public lastName:string,
    public email:string,
    public address: string
){}}

在用户组件中，我定义了addUser函数：

addUser(user:any, address:any){
    if (this.form.valid) { let newUser = new User([user["firstName"], user["lastName"], user["email"], user["address"]);}}

我得到一个新用户，其中attribut“address = undefined”。为什么????

Answer 1

即使我向this.fb.group添加地址，也没有任何变化。 HTML文件太长，这是输入部分：

 <div class="tab-pane active" id="profile">                                                
                            <div class="form-group">
                                <label class="text-gray">First name :</label>
                                <input formControlName="firstName" class="form-control validation-field" type="text">
                                <small class="text-danger" *ngIf="form.controls.firstName.touched && form.controls.firstName.errors?.required">firstName is required</small>                              
                                <small class="text-danger" *ngIf="form.controls.firstName.touched && form.controls.firstName.errors?.minlength">firstName isn't long enough, minimum of 5 characters</small>
                            </div>
                            <div class="form-group">
                                <label class="text-gray">Last name :</label>
                                <input formControlName="lastName" class="form-control validation-field" type="text">
                                <small class="text-danger" *ngIf="form.controls.lastName.touched && form.controls.lastName.errors?.required">lastName is required</small>                              
                                <small class="text-danger" *ngIf="form.controls.lastName.touched && form.controls.lastName.errors?.minlength">lastName isn't long enough, minimum of 6 characters</small>
                            </div>  
<div class="tab-pane" id="address">
                            <div class="form-group">
                                <label class="text-gray">Address :</label>
                                <div class="input-group" >
                                    <div class="input-group-addon"><i class="fa fa-map-marker"></i></div>
                                    <input  formControlName="address" class="form-control validation-field" type="text">
                                    <small class="text-danger" *ngIf="form.controls.town.touched && form.controls.town.errors?.required">assress is required</small>                              
                                    <small class="text-danger" *ngIf="form.controls.town.touched && form.controls.town.errors?.minlength">address isn't long enough, minimum of 6 characters</small>
                                </div>
                            </div>

Answer 2

@Component({
  selector: 'app-unauthorizedUser',
  templateUrl: './unauthorizedUser.component.html',
  styleUrls: ['./unauthorizedUser.component.scss'],
  encapsulation: ViewEncapsulation.None,
  providers: [ UnauthorizedUserService, GlobalService, AuthorisedRoleService]
})
export class UnauthorizedUserComponent implements OnInit {

  users:User[];
  modalRef: NgbModalRef;
  form:FormGroup;

  constructor(
    private unauthorizedUserService: UnauthorizedUserService,
    public toastrService: ToastrService,
    public modalService: NgbModal,
    public fb:FormBuilder)
  { }

  ngOnInit(): void{
    this.getUsers();
    this.form = this.fb.group({
      firstName: ['', Validators.compose([Validators.required, Validators.minLength(3)])],
      lastName:['', Validators.compose([Validators.required, Validators.minLength(3)])],
      email: ['', Validators.compose([Validators.required, Validators.minLength(5)])],
    });
  }

   // return list of unauthorized users 
   getUsers(): void {
    this.unauthorizedUserService.getUsers()
      .subscribe((users: User[]) => this.users = users);
  }

  // add a new user via a popup
  addDialog(add,user ) {
    this.modalRef = this.modalService.open(add, { container: '.app' });
    //console.log(this.roles);
    //this.selectedRole = user;
  }
  addUser(user:any){
    if (this.form.valid) {
      let newUser = new User(user["test"],user["firstName"], user["lastName"], user["email"],
                            user["address"]);

      this.unauthorizedUserService.addUser(newUser).subscribe(user => {
        if(user == 1){
          this.toastrService.success('Un nouveau user est ajouté avec succés !' + newUser.firstName );
          this.form.reset();
        }else{
          this.toastrService.error("L'ajout de user a rencontrée un erreur");
        }
      });  
      console.log(newUser);
      console.log(user.address);

    }
    this.modalRef.close();
  }

为什么我得到未定义的输入字段

2 个答案: