Questions & Answers

Can not get property value from a column from another entity, Angular, Typescript, Java Spring

I am learning Angular and writing a simple pet-project(internet-shop) using Java Spring for the backend and Angular for UI.

I have the following DB structure:

Producer table: producer table

Product table:product table

Product entity:

public class Product {

@GeneratedValue(strategy = GenerationType.IDENTITY)
@Column(name = "id")
private Long id;

@JoinColumn(name = "category_id", nullable = false)
private ProductCategory category;

@Column(name = "sku")
private String sku;

@Column(name = "name")
private String name;

@Column(name = "description")
private String description;

@Column(name = "unit_price")
private BigDecimal unitPrice;

@Column(name = "image_url")
private String imageUrl;

@Column(name = "active")
private boolean active;

@Column(name = "units_in_stock")
private int unitsInStock;

@Column(name = "date_created")
private Date dateCreated;

@Column(name = "last_updated")
private Date lastUpdated;

@ManyToOne(cascade = CascadeType.ALL)
@JoinColumn(name = "producer_id")
private Producer producer;`

Producer entity:

public class Producer {

@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;

private String firstName;

private String lastName;

private String email;

@OneToMany(mappedBy = "producer")
private List<Product> products;

@ManyToOne(cascade = CascadeType.ALL)
@JoinColumn(name = "delivery_id")
private Delivery delivery;


TypeScript class for Product:

`import { Producer } from "./producer";

export class Product {

constructor(public id: string,
            public sku: string,
            public name: string,
            public description: string,
            public unitPrice: number,
            public imageUrl: string,
            public active: boolean,
            public unitsInStock: number,
            public dateCreated: Date,
            public lastUpdated: Date,
            public producerId: Producer['id']
    ) {

and for Producer:

`export class Producer {

constructor (public id: number,
    public firstName: string,
    public lastName: string,
    public email: string) { }

` and for CartItem:

import { Product } from './product';

export class CartItem {

id: string;
name: string;
imageUrl: string;
unitPrice: number;
producerId: number;

quantity: number;

constructor(product: Product) { =; =;
    this.imageUrl = product.imageUrl;
    this.unitPrice = product.unitPrice;
    this.producerId = product.producerId;

    this.quantity = 1;


Adding to cart logic:

 addToCart(theCartItem: CartItem) {

    // check if we already have the item in our cart
    let alreadyExistsInCart: boolean = false; 
    let existingCartItem: CartItem = undefined;

    if (this.cartItems.length > 0) {
      // find the item in the cart based on item id

      existingCartItem = this.cartItems.find( tempCartItem => === );

      // check if we found it
      alreadyExistsInCart = (existingCartItem != undefined);

    if (alreadyExistsInCart) {
      // increment the quantity
    else {
      // just add the item to the array

    // compute cart total price and total quantity

  computeCartTotals() {

    let totalPriceValue: number = 0;
    let totalQuantityValue: number = 0;

    for (let currentCartItem of this.cartItems) {
      totalPriceValue += currentCartItem.quantity * currentCartItem.unitPrice;
      totalQuantityValue += currentCartItem.quantity;

    // publish the new values ... all subscribers will receive the new data;;

    // log cart data just for debugging purposes
    this.logCartData(totalPriceValue, totalQuantityValue);

  logCartData(totalPriceValue: number, totalQuantityValue: number) {

    console.log('Contents of the cart');
    for (let tempCartItem of this.cartItems) {

    /*  this.handleProducerDetails(;
      console.log(`Added producer: ${this.producer.firstName}`);*/

      const subTotalPrice = tempCartItem.quantity * tempCartItem.unitPrice;
      console.log(`name: ${}, quantity=${tempCartItem.quantity}, 
      unitPrice=${tempCartItem.unitPrice}, subTotalPrice=${subTotalPrice}, producerId=${tempCartItem.producerId}`);

When I am adding an item to the cart, the logic I wrote sees al fields of my item, except producer_id (=undefined). See the console pic: updefined producer id

I am thinking now I made a mistake in the models class from UI side creation, but got stuck, where is this issue.

UPD: when I debug, I am getting undefined here, so I understand it like an issue is somewhere in the models? enter image description here

I want to get a correct value from the database to be sent on UI side.

2023-01-23 17:42:03
Have you confirmed that the id is actually being sent from the BE. Seems odd that all other values work besides the id.
2023-01-23 17:42:03
@Levidps when I review a product from BE, it sees the info about producer: "localhost:8080/api/products{productId}/producer" I can get an info from BE about my producer linked to this product.
Answers(0) :