Как искать внутри массива в p-таблице primeNg.?

Question

У меня есть точки данных, как массив. Поэтому я пытаюсь найти значение в массиве, но оно не работает в primeng

В файле компонента у меня есть нижняя часть кода,

tableHeader = [
    { field: 'name', header: 'Name' },
    { field: 'skills', header: 'Skills' },
];

data = [
    {
        name:"User1",
        skills:["JS","Java","Angular"]
    },{
        name:"TestUser",
        skills:["HTML","Css"]
    },{
        name:"Root",
        skills:["HTML","Css","Angular","Python","Perl"]
    }
];

И HTML-код

<p-table #dt [value]="data">
    <ng-template pTemplate="header">
    <tr>
            <th>Name</th>
            <th>Skills</th>
    </tr>
    <tr>
        <th>
            <input pInputText type="text" (input)="dt.filter($event.target.value, 'name', 'contains')">
        </th>
        <th>
            <input pInputText type="text" (input)="dt.filter($event.target.value, 'skills', 'contains')">
        </th>
    </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData>
        <tr>
            <td>{{rowData['name']}}</td>
            <td>
                <span *ngFor="let skill of rowData.skills;">
                {{skill}}
                </span>
            </td>
        </tr>
    </ng-template>
<p-table> 

Я не могу найти поле Name, но не могу найти поле Skills. потому что он содержит значение массива.

Answer 1

Обходите, чтобы получить правильный результат поиска, который я пробовал, и это сработало для меня.

Попробуйте добавить запятую "," после строки {{skill}}. Сообщите мне в случае любой путаницы.

Как это: -

<p-table #dt [value]="data">
    <ng-template pTemplate="header">
    <tr>
            <th>Name</th>
            <th>Skills</th>
    </tr>
    <tr>
        <th>
            <input pInputText type="text" (input)="dt.filter($event.target.value, 'name', 'contains')">
        </th>
        <th>
            <input pInputText type="text" (input)="dt.filter($event.target.value, 'skills', 'contains')">
        </th>
    </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData>
        <tr>
            <td>{{rowData['name']}}</td>
            <td>
                <span *ngFor="let skill of rowData.skills;">{{skill}},</span>
            </td>
        </tr>
    </ng-template>
<p-table>