我坚持使用 Angular5 ReactiveForm。
实际上,我创建了一个基本模型子
子模型.ts:
export interface Subscription {
name: string;
}
我也有一个组件: : sub.component.ts
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Sub } from '@models/sub.model';
@Component({
selector: 'md-subscribe',
templateUrl: './subscribe.component.html',
styleUrls: ['./subscribe.component.scss']
})
export class SubComponent {
subForm: FormGroup;
sub: Subscription;
constructor(private builder: FormBuilder) {
this.subForm = this.builder.group({
name : ['', Validators.required]
});
}
subscribe() {
this.sub.name = 'test value';
}
}
最后,一个 html 模板:
<form class="form align-end" [formGroup]="subscribeForm" (ngSubmit)="subscribe()">
<h2 class="label label--blue">S'inscrire</h2>
<div class="form-group"><input type="text" id="name" name="name" formControlName="name" placeholder="Hubert" required /></div>
</form>
所以我尝试提交表格。我可以使用 获取值,this.subForm.value
但是当我尝试分配值时test value
,this.subForm.value.name
我在控制台中出现错误。
ERROR TypeError: Cannot set property 'email' of undefined
at SubscribeComponent.subscribe (subscribe.component.ts:24)
at Object.eval [as handleEvent] (SubscribeComponent.html:1)
at handleEvent (core.js:13581)
at callWithDebugContext (core.js:15090)
at Object.debugHandleEvent [as handleEvent] (core.js:14677)
at dispatchEvent (core.js:9990)
at eval (core.js:12332)
at SafeSubscriber.schedulerFn [as _next] (core.js:4351)
at SafeSubscriber.__tryOrUnsub (Subscriber.js:240)
at SafeSubscriber.next (Subscriber.js:187)
事实上,我的对象 sub 是未定义的,但为什么我不能赋值。我也更改了 zone.js 版本,但问题仍然存在。我如何分配价值?