Primeng KeyFilter无法输入点号问题求助（版本v5.2.0-rc.1）

I've run into this exact issue with PrimeNG 5.x's KeyFilter before! The problem here boils down to how the KeyFilter validates input in real-time versus how you test the regex against a complete, finished string.

Why Your Original Regex Fails #

Your current regex /^[0-9]+(\.[0-9]{1,2})?$/ requires at least one digit before the decimal point. When you try to type . first, the current input value is just "."—which doesn't match the regex at all. KeyFilter blocks the input immediately because it checks every keystroke against the full regex pattern. When testing the regex in isolation, you're probably testing complete valid strings like "12.34" (which works), but the real-time validation catches these intermediate invalid states.

Fix: Adjust the Regex to Support Intermediate Input #

Modify your regex to allow temporary valid intermediate states (like just "." or ".5") while still enforcing your final validation rules. Your required attribute will handle catching empty values on form submission, so we don't have to worry about that here:

patternDecimal: RegExp = /^\d*(\.\d{1,2})?$/;

Breakdown of the Updated Regex #

• ^\d*: Allows zero or more digits at the start (so empty input or leading digits are both acceptable during typing)
• (\.\d{1,2})?$: Optional decimal point followed by 1-2 digits (this lets ., .1, .12, or 12.3 pass the real-time check)

Optional: Enforce Leading Zero for Decimals #

If you want to disallow inputs like .12 and force users to type 0.12 instead, use this regex. Users will need to type 0 first, then .—and both "0" and "0." will pass the real-time validation:

patternDecimal: RegExp = /^(0|[1-9]\d*)(\.\d{1,2})?$/;

Keep your template code exactly as it is—only the regex in your TypeScript needs updating. This should resolve the issue where the decimal point was being blocked mid-input.

内容的提问来源于stack exchange，提问作者beginerdeveloper