Why does the code below not fire in primeng, but works perfectly in jquery?
PrimeNG Snippet (Does not work!)
app.component.html
<div class="p-field p-float-label">
<input pInputText id="weight" name="weight" maxlength="10" [(ngModel)]="data.weight" (onkeypress)="isValidWeight($event)" />
<label for="float-input">Weight (Kg) 0.5 - 500</label>
</div>
app.component.ts
isValidWeight(event): void {
const key = event.keyCode;
if ((key >= 48 && key <= 57) || key === 46) {
return;
}
event.preventDefault();
}
HTML & jQuery Example (As mentioned works flawlessly)
app.html
<!DOCTYPE html>
<html>
<head>
<title>Playground</title>
<script src="js/jquery-3.7.1.js"></script>
</head>
<body>
<input type="text" id="element" name="element" />
<script>
$( document ).ready(function() {
$( "#element" ).keypress(function(e) {
var key = e.keyCode;
if ((key >= 48 && key <= 57) || key == 46) {
return;
}
e.preventDefault();
});
});
</script>
</body>
</html>
StackBlitz - Unavailable as StackBlitz was throwing annoying issues when trying to create a vanilla html/jquery example.