Как изменить тип переменной в Angular

Question

Я использую {{product.price.toLocaleString('en-US', {style: 'currency', currency: 'CAD'})}}

Для отображения цены на мой взгляд. Это работало, когда я вручную вводил значение в массиве в Angular.

Теперь я выбираю базу данных для заполнения массива продуктов.

Поле цены имеет тип INT

Результат базы данных подается на angular с запросом ajax и json в кодировке

Цена отображается, но не $ CA после нее. Я думаю, что функция не видит это значение как Number­.

Эта функция используется для получения всех данных о моем продукте.

sendGetRequest(){
    this.http.get('http://localhost/ajax.php').subscribe((productList)=>{
       this.productList=productList;
    });
}

Затем angular view

<app-product data-ng-init="sendGetRequest()" (productAdded)="addProductToCart($event)" [products]="productList"> </app-product>

Действительные данные отображаются

<section *ngFor="let product of products" >
      <div >
        {{product.model}}
        <br>
        <div class="preView"><img src="./assets/{{product.img}}"></div>
        {{product.price.toLocaleString('en-US', {style: 'currency', currency: 'CAD'})}}<br>
        <button (click)="addProductToCart(product)">+</button><br>
      </div>
  </section>

Так что я не уверен, где и как мне следует работать с типом.

Если я изменю свою функцию на ;

  sendGetRequest(){
    this.http.get('http://localhost/ajax.php').subscribe((productList)=>{
       this.productList=productList.map(product=>{
        product.price = +product.price; // cast to number
        return product;
      });
    });

}

Я получаю предупреждение;

Свойство 'map' не существует для типа 'Object

, но Visual Studio предлагает исправление, поэтому я попробовал его, и теперь мой код выглядит так:

 private _productList: any;
  public get productList(): any {
    return this._productList;
  }
  public set productList(value: any) {
    this._productList = value;
  }

  sendGetRequest(){
    this.http.get('http://localhost/ajax.php').subscribe((productList)=>{
       this.productList=productList.map(product=>{
        product.price = +product.price; // cast to number
        return product;
      });
    });
}

Сейчас он работает, но я все еще получаю ошибку для карты;

ОШИБКА в src / app / store / store.component.ts: 28: 37 - ошибка TS2339: свойство 'map' не существует для типа 'Object'.

28        this.productList=productList.map(product=>{

Вот изображение моего экрана

Answer 1

sendGetRequest(){
    this.http.get('http://localhost/ajax.php').subscribe((productList)=>{
    this.productList=productList.map(product=>{
        product.price = +product.price; // cast to number
        return product;
      });
   });
}

вам просто нужно привести его к номеру. Вы получаете строковую цену типа.