我有产品界面:
export interface Product{
code: string;
description: string;
type: string;
}
使用方法调用产品端点的服务:
public getProducts(): Observable<Product> {
return this.http.get<Product>(`api/products/v1/`);
}
以及我使用此服务获取产品的组件。
export class ShopComponent implements OnInit {
public productsArray: Product[];
ngOnInit() {
this.productService.getProducts().subscribe(res => {
this.productsArray = res;
});
}
}
在这种状态下我得到了错误:
[ts]类型“产品”缺少类型的以下属性 'Product []':长度,弹出,推送,连拍以及另外26个。 [2740]
取消在productsArray
变量上的键入可以消除该错误,但是由于服务器响应是一组Products
类型的对象数组,所以不知道为什么它不起作用吗?
答案 0 :(得分:9)
您将返回dat1 <- read.table(header = TRUE, text="
Time GB
1 300
2 500
1 0
2 200
1 0
")
,并期望它在Observable<Product>
回调中成为Product[]
。
从subscribe
和http.get()
返回的类型应为getProducts()
Observable<Product[]>
答案 1 :(得分:2)
我遇到了同样的问题,并解决了以下问题 定义像我的接口
export class Notification {
id: number;
heading: string;
link: string;
}
并在nofificationService中写入
allNotifications: Notification[];
//NotificationDetail: Notification;
private notificationsUrl = 'assets/data/notification.json'; // URL to web api
private downloadsUrl = 'assets/data/download.json'; // URL to web api
constructor(private httpClient: HttpClient ) { }
getNotifications(): Observable<Notification[]> {
//return this.allNotifications = this.NotificationDetail.slice(0);
return this.httpClient.get<Notification[]>
(this.notificationsUrl).pipe(map(res => this.allNotifications = res))
}
并在组件中写入
constructor(private notificationService: NotificationService) {
}
ngOnInit() {
/* get Notifications */
this.notificationService.getNotifications().subscribe(data => this.notifications = data);
}
答案 2 :(得分:1)
您已经忘记将getProducts返回类型标记为数组。在您的getProducts中,它表示将返回单个产品。因此,将其更改为:
public getProducts(): Observable<Product[]> {
return this.http.get<Product[]>(`api/products/v1/`);
}
答案 3 :(得分:1)
对于像我这样的新手,请不要为服务响应的含义分配变量
export class ShopComponent implements OnInit {
public productsArray: Product[];
ngOnInit() {
this.productService.getProducts().subscribe(res => {
this.productsArray = res;
});
}
}
代替
export class ShopComponent implements OnInit {
public productsArray: Product[];
ngOnInit() {
this.productsArray = this.productService.getProducts().subscribe();
}
}
答案 4 :(得分:1)
我在GraphQL突变输入对象上收到相同的错误消息,然后发现了问题,实际上在我的情况下,突变期望将对象数组作为输入,但是我试图插入单个对象作为输入。例如:
第一次尝试
const mutationName = await apolloClient.mutate<insert_mutation, insert_mutationVariables>({
mutation: MUTATION,
variables: {
objects: {id: 1, name: "John Doe"},
},
});
更正的突变调用作为数组
const mutationName = await apolloClient.mutate<insert_mutation, insert_mutationVariables>({
mutation: MUTATION,
variables: {
objects: [{id: 1, name: "John Doe"}],
},
});
有时,诸如此类的简单错误可能会导致问题。希望这会帮助某人。
答案 5 :(得分:0)
此错误也可能是因为您没有订阅Observable。
示例,而不是:
this.products = this.productService.getProducts();
执行以下操作:
this.productService.getProducts().subscribe({
next: products=>this.products = products,
error: err=>this.errorMessage = err
});
答案 6 :(得分:0)
您必须指定响应的类型
this.productService.getProducts().subscribe(res => {
this.productsArray = res;
});
尝试一下
this.productService.getProducts().subscribe((res: Product[]) => {
this.productsArray = res;
});
答案 7 :(得分:0)
对我来说,错误是由 url 字符串的错误类型提示引起的。我用过:
export class TodoService {
apiUrl: String = 'https://jsonplaceholder.typicode.com/todos' // wrong uppercase String
constructor(private httpClient: HttpClient) { }
getTodos(): Observable<Todo[]> {
return this.httpClient.get<Todo[]>(this.apiUrl)
}
}
我应该使用的地方
export class TodoService {
apiUrl: string = 'https://jsonplaceholder.typicode.com/todos' // lowercase string!
constructor(private httpClient: HttpClient) { }
getTodos(): Observable<Todo[]> {
return this.httpClient.get<Todo[]>(this.apiUrl)
}
}