PrimeNG InputMask是否支持像ngx-mask那样定义双掩码？

PrimeNG的InputMask组件原生不支持像ngx-mask那样用||分隔的多可选掩码语法，无法直接通过单个掩码字符串定义两种可选格式。不过可以通过以下两种方式实现类似效果：

方式一：动态切换掩码 #

监听输入内容的长度或特征，动态修改InputMask的mask属性，适配不同格式需求。以CPF/CNPJ为例：

组件逻辑 #

import { Component } from '@angular/core';

@Component({
  selector: 'app-document-input',
  templateUrl: './document-input.component.html'
})
export class DocumentInputComponent {
  documentValue: string = '';
  currentMask: string = '999.999.999-99'; // 默认CPF掩码

  onInputChange(event: Event) {
    const inputElement = event.target as HTMLInputElement;
    const cleanValue = inputElement.value.replace(/\D/g, ''); // 移除非数字字符

    // 根据长度切换掩码：11位以内用CPF，超过11位用CNPJ
    this.currentMask = cleanValue.length > 11 ? '99.999.999/9999-99' : '999.999.999-99';
  }
}

模板代码 #

<p-inputMask 
  [(ngModel)]="documentValue" 
  [mask]="currentMask" 
  (input)="onInputChange($event)"
  placeholder="输入CPF或CNPJ"
></p-inputMask>

方式二：自定义格式化逻辑，脱离组件掩码限制 #

不依赖InputMask的内置掩码，手动处理输入值的格式化，同时验证输入是否符合目标格式之一：

组件逻辑 #

import { Component } from '@angular/core';

@Component({
  selector: 'app-document-input',
  templateUrl: './document-input.component.html'
})
export class DocumentInputComponent {
  documentValue: string = '';

  formatDocument(value: string) {
    const cleanValue = value.replace(/\D/g, '');
    let formatted = '';

    if (cleanValue.length <= 11) {
      // 按CPF格式格式化
      formatted = cleanValue.replace(/(\d{3})(\d{3})(\d{3})(\d{2})/, '$1.$2.$3-$4');
    } else if (cleanValue.length <= 14) {
      // 按CNPJ格式格式化
      formatted = cleanValue.replace(/(\d{2})(\d{3})(\d{3})(\d{4})(\d{2})/, '$1.$2.$3/$4-$5');
    }

    this.documentValue = formatted;
  }

  validateDocument(): boolean {
    const cleanValue = this.documentValue.replace(/\D/g, '');
    // 验证是否为11位CPF或14位CNPJ
    return cleanValue.length === 11 || cleanValue.length === 14;
  }
}

模板代码 #

<input 
  [(ngModel)]="documentValue" 
  (ngModelChange)="formatDocument($event)"
  placeholder="输入CPF或CNPJ"
/>
<!-- 可选：添加验证提示 -->
<div *ngIf="!validateDocument()" style="color: red;">
  请输入有效的CPF或CNPJ格式
</div>

补充说明 #

如果需要更复杂的多掩码场景，可以结合Angular自定义指令封装格式化逻辑，或者根据项目需求评估是否需要切换到支持多掩码的ngx-mask库。

内容的提问来源于stack exchange，提问作者Max Bündchen