How to save boolean value with checkbox in MySQL using Angular12?

I'm working on an angular project connected to API and MySQL database. But I'm having a problem with my checkbox, when I add an order to the order list, the isDiscount checkbox is not saving the expected value to the database. The checkbox returns boolean values but it always return 0 value even though I always check the isDiscount checkbox to make the value True.

here is my code in order.component.html

<div class="form group col-md-3">
    <div class="form-check">
      <label class="form-check-inline" for="autoSizingCheck">On Discount Promo?</label><br/>
      <input #isDiscounted
              class="form-check-input"
              type="checkbox"
              id="isDiscounted"
              [checked]="order.isDiscounted == true"
              name="isDiscounted"/>
    </div>
  </div>

here's my order.ts

export class Order {
  id: number;
  orderName: string;
  price: number;
  isDiscounted: boolean;
  isDiscountPercentage: number = 5;
}

here's my order.service.ts

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { environment } from 'src/environments/environment';
import { Order } from './order';
import { map } from 'rxjs/internal/operators/map';

@Injectable({
  providedIn: 'root'
})
export class OrderService {
  order: Order[];
  orders: BehaviorSubject<Order[]> = new BehaviorSubject([]);

  private BASE_URL = environment.apiBaseUrl;
  constructor(
    private http: HttpClient
  ) { }

  public addOrder(order: Order): Observable<Order> {
    return this.http.post<Order>(`${this.BASE_URL}/add`, order)
      .pipe(map((order) => {
        this.order.push(order);
        this.orders.next(this.order);

        return order;
      }));
  }

  public updateOrder(id: number, value: any): Observable<Order> {
    return this.http.put<Order>(`${this.BASE_URL}/update/${id}`, value);
  }

  public deleteOrder(id: number): Observable<any> {
    return this.http.delete(`${this.BASE_URL}/delete/${id}`, {responseType: 'text'});
  }

  public getOrderList(): Observable<Order[]> {
    return this.http.get<Order[]>(`${this.BASE_URL}/orders`)
      .pipe(map((orders) => {
        this.order = orders;
        this.orders.next(this.order);

        return orders;
      }));
  }
}

my order.component typescript file doesn't have a method for this. what should I add or modify?.