Is it possible to add 2 decimals in an ngModel?

I have an input with the variable name sipmaximum. This variable returns a numeric value.

For example

9999


template

<tr>
<th>SIP maximum </th>
<td>
<input id="sipmaximum" name="sipmaximum" type="text" class="form-control" [(ngModel)]="sipmaximum" style="width: 70%" required greaterThanZero />
</td>
</tr>




Normally, the variable sipmaximum should display

9999.00


Here is the JSON

{
"AANBOD": {
"ISINAANBOD": "Y",
"RISK": "3",
"COMMENTAIRE_FR": "",
"COMMENTAIRE_NL": "",
"QTTE_TOTALE": 0,
"QTTE_FAITE": 0,
"QTTE_REST": 0,
"QTTE_MIN": 100,
"QTTE_MAX": 15000,
"MULTIPLE": 0,
"DATEVALID_DEBUT": "2019-09-16",
"DATEVALID_FIN": "2050-12-31",
"MARKET": "",
"SIPAGENCEFLAG": "Y",
"SIPCLIENTFLAG": "N",
"SIPMINIMUM": 50,
"SIPMAXIMUM": 9999
}
}


How should I add the .00, please?

export class EditPurchasableSecuritiesComponent implements OnInit, OnDestroy {
private unsubscribe$ = new Subject<void>();

svm: string;
risk: string;
datedeb: Date;
datefin: Date;
min: number;
max: number;
sipminimum: number;
sipmaximum: number;

TIT: Tit[] = [];

constructor(
private service: EditPurchasableSecuritiesService,
private activatedRoute: ActivatedRoute,
private location: Location,
private router: Router
) {}

ngOnInit(): void {
let svm: string | null;
svm = this.activatedRoute.snapshot.paramMap.get("svm");
if (!svm) {
this.goBack();
return;
}
this.svm = svm;
this.editPurchasableSecuritiesManagement(this.svm);
this.datedeb = new Date();
}

ngOnDestroy(): void {
this.unsubscribe$.next();
this.unsubscribe$.complete();
}

editPurchasableSecuritiesManagement(svm: string): void {
this.service
.editPurchasableSecuritiesManagement(this.svm)
.pipe(takeUntil(this.unsubscribe$))
.subscribe((res) => {
if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
this.TIT = res.TIT;
this.risk = res.TIT[0].AANBOD.RISK;
this.datedeb = new Date();
this.datefin = new Date(res.TIT[0].AANBOD.DATEVALID_FIN);
this.min = res.TIT[0].AANBOD.QTTE_MIN;
this.max = res.TIT[0].AANBOD.QTTE_MAX;
this.sipminimum = res.TIT[0].AANBOD.SIPMINIMUM;
this.sipmaximum = res.TIT[0].AANBOD.SIPMAXIMUM;
}
});
}

goBack(): void {
this.location.back();
}

updatePurchasableSecuritiesManagement(): void {
this.service
.updatePurchasableSecuritiesManagement(
this.svm,
this.risk,
this.datedeb,
this.datefin,
this.min,
this.max,
this.sipminimum,
this.sipmaximum
)
.pipe(takeUntil(this.unsubscribe$))
.subscribe((res) => {
if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
this.router
.navigateByUrl("/", { skipLocationChange: true })
.then(() => {
this.router.navigate([
"functional-management/list-purchasable-securities",
]);
});
}
});
}
}


Interface

export interface PurchasableSecuritieResponse extends ApiResponse {
TIT: Tit[];
}

export interface Tit {
ADVTITRE: {
BASIQUETITRE: {
SVM: number;
ISIN: string;
STOCK: string;
LABEL: string;
PLACE: number;
PLACELABEL: string;
REGR: number;
REGRLABEL: string;
DEVISE: string;
COURS: {
DATE: string;
TIME: string;
VALUE: number;
HIGH: number;
LOW: number;
CLOTURE: number;
};
};
EXIST: number;
SECE: number;
SECE_LIB: string;
PAYS: number;
PAYS_LIB: string;
YPMAR: string;
CUM: string;
DEVCP: string;
CPPX: number;
DATCPN: string;
COURG: number;
DCOURG: string;
COURB: number;
DCOURB: string;
CODEF: number;
ECHEANCE: string;
RADIATION: string;
COTATION: string;
RATING: string;
COURUS: number;
BRUT: number;
ECH1: string;
ECH2: string;
ECH3: string;
ECH4: string;
ECH5: string;
TAUX1: number;
TAUX2: number;
TAUX3: number;
TAUX4: number;
TAUX5: number;
HYPERLINK: string;
INFOBOU: number;
HISTCOURS: number;
GROUPE: string;
COUPON: number;
WARRANT: number;
OPTION: number;
REVERSE: number;
RECO: number;
SIGNAUX: number;
};
TITARG: {
COMPLEXITY: string;
CREATTIME: string;
CREATUSER: string;
MODTIME: string;
MODUSER: string;
CREATMODE: string;
};
AANBOD: {
ISINAANBOD: string;
RISK: string;
COMMENTAIRE_FR: string;
COMMENTAIRE_NL: string;
QTTE_TOTALE: number;
QTTE_FAITE: number;
QTTE_REST: number;
QTTE_MIN: number;
QTTE_MAX: number;
MULTIPLE: number;
DATEVALID_DEBUT: Date;
DATEVALID_FIN: Date;
MARKET: string;
SIPAGENCEFLAG: string;
SIPCLIENTFLAG: string;
SIPMINIMUM: number;
SIPMAXIMUM: number;
PRIX_MARCHE: number;
PRIX_CLIENT: number;
};
...

Continue reading...