我正在使用 Angular 版本 9。我創建了一個包含 5 個字段的表單,稱為全名、電子郵件、電話、公司、地址。我在表單中使用 ngForm 指令來獲取每次提交時提交的數據,并處理 ngSubmit 事件來獲取表單數據。但我無法將該對象添加到數組中。如何實現這一目標?這是我的代碼...import { Component, OnInit } from '@angular/core';import { NgForm, EmailValidator } from '@angular/forms';import { ContactListService } from '../contact-list.service';import { JsonPipe } from '@angular/common';@Component({ selector: 'app-new-contact', templateUrl:'./new-contact.component.html', styleUrls: ['./new-contact.component.css']})export class NewContactComponent implements OnInit { constructor(private contactList: ContactListService) { } arraydata:formData[]; ngOnInit(): void { } data(f:NgForm){ this.arraydata.push(f.value); }}interface formData{ fullName:string; email:string; phone:number; company:string; address:string;}<form #f="ngForm" (ngSubmit)="data(f)"> <div class="form-group row"> <label for="fullName" class="col-sm-2 col-form-label">Full Name</label> <div class="col-sm-10"> <input type="text" required ngModel name="fullName" name="fullName" class="form-control" id="fullName" placeholder="Please Enter Your Full Name"> </div> </div> <div class="form-group row"> <label for="email" class="col-sm-2 col-form-label">Email</label> <div class="col-sm-10"> <input type="email" required ngModel name="email" name="email" class="form-control" id="email" placeholder="Please Enter Your Email"> </div> </div> <div class="form-group row"> <label for="phone" class="col-sm-2 col-form-label">Phone</label> <div class="col-sm-10"> <input type="number" required ngModel name="phone" name="phone" class="form-control" id="phone" placeholder="Please Enter Your Phone Number"> </div>
2 回答

慕尼黑的夜晚無繁華
TA貢獻1864條經驗 獲得超6個贊
您尚未初始化數組 arraydata。因此它在您的組件中未定義。
只需將 arraydata 初始化為一個空數組,如下所示
arraydata:formData[] =[]
- 2 回答
- 0 關注
- 175 瀏覽
添加回答
舉報
0/150
提交
取消