Свойство Angular не существует при ошибке типа

#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