File

src/app/home/content/product-list/product-list-item/product-list-item.component.ts

Implements

OnInit

Metadata

selector app-product-list-item
styleUrls product-list-item.component.scss
templateUrl ./product-list-item.component.html

Inputs

product

Type: Product

Constructor

constructor()

Methods

ngOnInit
ngOnInit()
Returns: void
getProductImageUrl
getProductImageUrl(url: any)
Returns: void
import { environment } from './../../../../../environments/environment';
import { Product } from './../../../../core/models/product';
import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-product-list-item',
  templateUrl: './product-list-item.component.html',
  styleUrls: ['./product-list-item.component.scss']
})
export class ProductListItemComponent implements OnInit {
  @Input() product: Product;

  constructor() { }

  ngOnInit() {
  }

  getProductImageUrl(url) {
    return environment.API_ENDPOINT + url;
  }
}
<div class="product-tile">
  <p> Product id: {{ product.id }} </p>
  <p> Product Name : {{ product.name }} </p>
  <p> Product Price : {{ product.price }} </p>
  <img [src]="getProductImageUrl(product.master.images[0]?.product_url)">
</div>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""