#html #angular #http #webapi
#HTML #angular #http #webapi
Вопрос:
в моем сервисе у меня есть:
getCart(): Observable<Cart[]> {
return this.http.get<Cart[]>(`${this.myApiUrl}/data/`);
}
в моем компоненте у меня есть:
my_data: Cart[]=[]
public loadCart() {
this.cart_Service.getCart().subscribe((data: Cart[]) => this.my_data = data);
}
в HTML-файле у меня есть:
<div *ngIf=" my_data">
<p> Grand Total : {{ my_data.grandTotal }} </p>
</div>
Я получаю сообщение об ошибке:»Свойство ‘GrandTotal’ не существует для типа’Cart[]'» кто-нибудь может помочь мне исправить эту ошибку? Я перепробовал много онлайн-решений, но это не сработало.
Комментарии:
1. Похоже
my_data
, что это массив, поэтому у него не будетgrandTotal
свойства. Вы либо использовали неправильный тип (Cart[]
), либо вам нужно выполнить итерацию по массиву. Если вы можете предоставить нам некоторые примеры данных, возвращаемых из API, мы могли бы помочь в дальнейшем.2. спасибо за ответ. в моих моделях у меня есть класс экспорта Cart { id:number; cartItems :(CartItem)[]; GrandTotal: number; }
3. Я думаю, вам просто нужно изменить тип с
Cart[]
наCart
.4. можете ли вы попробовать в своем HTML поместить my_data[0].GrandTotal вместо my_data.GrandTotal? просто для устранения неполадок
5. не могли бы вы попробовать вызвать конечную точку с помощью postman или другого программного обеспечения, чтобы убедиться, что конечная точка работает? и, пожалуйста, убедитесь, что вы не добавляете 2 косых черты в URL-адрес, подобный тому, который вы прокомментировали
Ответ №1:
Я, наконец, исправил это. В моем компоненте я изменил тип my_data на любой;
my_data: any;
Я также изменил функцию getCart() следующим образом:
getCart(): Observable<Cart[]> {
return this.http.get<Cart[]>(this.myAppUrl this.myApiUrl);
}
Комментарии:
1. поздравляю с решением проблемы, я хотел бы обратить ваше внимание на то, что 1) в качестве наилучшей практики использование более строгих типов лучше, чем использование более общих типов, поэтому не рекомендуется использовать тип «any», когда вы уверены, что тип будет Cart[] , и в случае, если типCart[] вызывает у вас проблему, лучше спросить о проблеме, чтобы исправить ее и заставить ее работать должным образом. 2) Еще одна вещь заключается в том, что определение переменной «myAppUrl» внутри каждой службы не является хорошей практикой, и вам следует рассмотреть возможность определения ее внутри файлов переменных среды angular angular.io/guide/build