无法将输入字段值传递给 Angular 中的服务 2

Question

接触-bar.component.ts

saveContacts(): void{
var contact = new Contact({});
contact.id = 1;
contact.name = 
(<HTMLInputElement>document.getElementById("contactName")).value;
contact.mobile = parseInt((<HTMLInputElement>document.getElementById("contactMobile")).value);
this.contactService.saveContact(contact);
}

contact.service.ts

saveContact(contact: Contact) {
    var contacts: Array<Contact> = 
JSON.parse(LocalStorage.getItem("contacts"));
    contacts.push(contact);
    localStorage.setItem("contacts", JSON.stringify(contacts));
}

Error: Cannot read property 'push' of null

Answer 1

首先关于您的错误：您正在收到 Cannot read property 'push' of null 因为您正在尝试获取联系人数据（通过 localstoarge ) 不存在。这就是为什么在将数据推送到数组时会提示您出现该错误的原因。

但是，您的代码中存在一些问题需要修复。

删除这一行： var contacts: Array<Contact> = JSON.parse(LocalStorage.getItem("contacts"));
不要将数据作为数组发送，请尝试以下操作：

代码：

var contact =  {
    contact.id : 1;   
    contact.name:(<HTMLInputElement>document.getElementById("contactName")).value;  
    contact.mobile: parseInt((<HTMLInputElement>document.getElementById("contactMobile")).value);
    }

this.contactService.saveContact(contact);

**contact.service.ts**

saveContact(contact: any) {
    localStorage.setItem("contacts", JSON.stringify(contact));
}

无法将输入字段值传递给 Angular 中的服务 2

cannot pass the input field value to service in Angular 2

angular-services

angular