错误 TS2339:类型 'Contact' 上不存在属性'n'



我正在尝试检测是否有任何元素被选中或没有使用data.n,但它给出的错误是属性n在类型"Contact"时不存在,所以可以做些什么来使此删除操作正常工作。我正在添加与上述问题相关的代码。

contact.service.ts.

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { HttpClientModule} from '@angular/common/http';
import {Contact} from './contact';
import {map} from 'rxjs/operators';
import {Observable,of, from } from 'rxjs';
@Injectable()
export class ContactService {
constructor(private http: HttpClient) { }
httpHeader = {
headers: new HttpHeaders({
'Content-Type': 'application/json'
})
}  

getContacts(): Observable<Contact[]> {
return this.http.get<Contact[]>('http://localhost:3000/api/contacts');
}
addContact(newContact) : Observable<Contact[]>
{
return this.http.post<Contact[]>('http://localhost:3000/api/contacts', newContact);
}
deleteContacts(id)
{
return this.http.delete('http://localhost:3000/api/contact'+id)
.pipe(map((res: Response) => res.json()));
}
}

联系人.组件.ts

import { Component, OnInit } from '@angular/core';
import {ContactService} from '../contact.service';
import {Contact} from '../contact';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { HttpClientModule} from '@angular/common/http';
@Component({
selector: 'app-contacts',
templateUrl: './contacts.component.html',
styleUrls: ['./contacts.component.css'],
providers: [ContactService]
})
export class ContactsComponent implements OnInit {
contacts: Contact[];
contact: Contact;
first_name:string;
last_name:string;
phone:string;

constructor(private contactService: ContactService) {}
addContact()
{
const newContact = {
first_name: this.first_name,
last_name: this.last_name,
phone: this.phone
}
this.contactService.addContact(newContact)
.subscribe(contact => {
this.contacts.push(contact);
});
}
deleteContacts(id:any)
{
var contacts = this.contacts;
this.contactService.deleteContacts(id)
.subscribe(data => {
if(data.n==1)
{
for(var i = 0; i < contacts.length; i++)
{
if(contacts[i]._id == id)
{
contacts.splice(i,i);
}
}
}
})
}
ngOnInit() {
this.contactService.getContacts()
.subscribe(contacts =>
this.contacts = contacts);
}
}

contact.component.html

<div>
<h2 class="page-header">Add Contact</h2>
<form (submit) = "addContact()">
<div>
<label>First Name</label>
<input type="text" [(ngModel)]="first_name" name = "first_name" class = "form-control">
</div>
<div>
<label>Last Name</label>
<input type="text" [(ngModel)]="last_name" name = "last_name" class = "form-control">
</div>
<div>
<label>Phone</label>
<input type="text" [(ngModel)]="phone" name = "phone" class = "form-control">
</div>
<input type="submit" class = "btn btn btn-success" value = "Add">
</form>
</div>
<hr>
<div>
<div *ngFor = "let contact of contacts">
<div class="list-group">
{{contact.first_name}}
</div>
<div class="list-group">
{{contact.last_name}}
</div>
<div class="list-group">
{{contact.phone}}
</div>
<div>
<input type="button" (click) = "deleteContacts(contact._id)" value = "Delete" class = "btn btn-danger">
</div>
</div>
</div>

您可以在deleteContact中提供类似的响应类型

this.http.delete<{n: number}>('http://localhost:3000/api/contact'+id)

我不确定答案是什么。所以这只是一个样本
也可以在组件内部将data的类型设置为any

subscribe((data: any) => {...}

最新更新