Как выполнить проверку регулярных выражений в редакторе таблиц PrimeNg? - PullRequest
Новая
       15

Как выполнить проверку регулярных выражений в редакторе таблиц PrimeNg?

0 голосов
/ 21 марта 2019

Я использую редактор PrimeNG DataTable.Я хочу реализовать проверку с помощью Regex для каждого поля.

Проверка Regex: только число и только алфавиты.

Как это можно сделать?

1 Ответ

0 голосов
/ 21 марта 2019

Вы можете достичь этого, используя (keyup) или (onBlur) событие.

В вашем файле component.html 

<p-table [value]="cars">
    <ng-template pTemplate="header">
        <tr>
            <th>Name</th>
            <th>Motor</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData>
        <tr>
            <td pEditableColumn>
                <p-cellEditor>
                    <ng-template pTemplate="input">
                        <input pInputText type="text" [(ngModel)]="rowData.name" (keyup)="onKey(rowData.name)">
                    </ng-template>
                    <ng-template pTemplate="output">
                        {{rowData.name}}
                    </ng-template>
                </p-cellEditor>
            </td>
            <td pEditableColumn>
                <p-cellEditor>
                    <ng-template pTemplate="input">
                        <input pInputText type="text" [(ngModel)]="rowData.motor" required>
                    </ng-template>
                    <ng-template pTemplate="output">
                        {{rowData.motor}}
                    </ng-template>
                </p-cellEditor>
            </td>
        </tr>
    </ng-template>
</p-table>

В файле component.ts 

public cars: any[];
public letters = /^[0-9a-zA-Z]+$/;
  constructor(){
    this.cars = [];
    this.cars.push({name: 'Audi', motor: '100ch'});
    this.cars.push({name: 'Honda', motor: '200ch'});
    this.cars.push({name: 'Mercedes', motor: '100ch'});
    this.cars.push({name: 'Renault', motor: '100ch'});
    this.cars.push({name: 'VW', motor: '100ch'});
  }
onKey(event:any){
    if(!event.match(this.letters))
    {
     console.log('Please input alphanumeric characters only');
    }
  }
...