Angular FormControl 对象能够接受任何类型的输入值,还是仅限于 typescript 原始类型?

Byr*_*uez 4 typescript angular angular-reactive-forms

我在 FormGroup 中使用 FormControl 对象在 Angular 中创建反应式表单。当我将原始参数作为 HTML 输入选择控件的值传递时没有问题。但是,当我传递一个自定义类的对象时,FormControl中的值被减少为[object Object]。

我正在使用的系统包括:Angular CLI:7.1.4;节点:10.15.0;角度:7.1.4;rxjs 6.3.3; 打字稿 3.1.6;网络包 4.23.1;Linux rdz1 4.15.0-43-generic #46-Ubuntu SMP Thu Dec 6 14:45:28 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl } from '@angular/forms';

@Component({
    selector: 'app-header-notes',
    templateUrl: './header-notes.component.html',
    styleUrls: ['./header-notes.component.css']
})

export class HeaderNotesComponent implements OnInit {
    ndcForm = new FormGroup({
        noteType: new FormControl(''),
        noteDate: new FormControl(''),
        noteFor: new FormControl(''),
        noteTo: new FormControl(''),
        noteDetail: new FormControl(''),
        noteDetailVal: new FormControl(''),
        noteChkRefInvoice: new FormControl('')
    });

    ngOnInit() { this.onChanges(); }

    onChanges(): void{
        this.ndcForm.valueChanges
        .subscribe( val => console.log(val))
    }
}
Run Code Online (Sandbox Code Playgroud)

控制台显示如下内容:{noteType: "credit", noteDate: "2019-01-01", noteTo: [object Object], ... }

我将一个对象 {param1: val1, parm2: val2} 传递给 "noteTo" ,所以我希望在控制台中观看这个值,但它显示的是 [object Object]。看起来对象是否已被字符串化。

Byr*_*uez 5

我找到了答案。在表格中,而不是使用:

<option *ngFor="let cargoAg of dfCargoAgs" [value]="cargoAg">{{cargoAg.nombre}}</option>
Run Code Online (Sandbox Code Playgroud)

我不得不使用:

<option *ngFor="let cargoAg of dfCargoAgs" [ngValue]="cargoAg">{{cargoAg.nombre}}</option>
Run Code Online (Sandbox Code Playgroud)

所以 [value] 只接受原始类型,但 [ngValue] 可以接受任何类的对象。我希望这会有所帮助。