Question

我正在尝试在ngAfterViewInit中获取表单值。不幸的是，它总是空着的。我很专业：{"name1":null, "name2": null}，但我得到{ }。

文档说明了以下ngAfterViewInit：

初始化组件的视图和子视图后调用
。

我假设此时已创建表单，但为什么我的值为空？

我的HTML：

<form novalidate #form="ngForm">
    // <Item 1...
    // <Item 2...


    <button type="submit" (click)="search()" class="btn btn-default">Zoeken</button>
</form>

//This is displaying the correct value
<div>
    <p>Form: {{ form.value | json }}</p>
    <p>Form status: {{ form.control.status }}</p>
</div>

组件：

export class BijComponent implements AfterViewInit, OnInit {
    @ViewChild('form') form: FormGroup;


    constructor(private bijService: BijService, private sessionService: SessionService) { }

    ngOnInit() {
        // Do stuff
    }

    ngAfterViewInit() {
        let v = JSON.stringify(this.form.value);// is `{ }`???
    }

    search(){
        //Search function
    }
}

Answer 1

那是因为javascript，让我解释一下：

创建表单时，它会创建一个内部对象，以使用每个字段存储表单值以设置数据。

但是如果变量从未受到影响，则其值不是null而是undefined，这意味着该变量不存在。

这就是为什么你{}而不是{"name1":null, "name2": null}。

为什么在ngAfterViewInit中form.value为空

1 个答案: