Таблица Jhipster с полями поиска по столбцам

Question

Я использую Jhipster в моем приложении. У меня есть таблица, в которую я добавил нумерацию страниц и сортировку, но я также хотел бы добавить поле поиска в столбце, это было бы возможно? Было бы что-то вроде этого http://ng -table.com /

Мой HTML-код:

<div class="table-responsive" *ngIf="entities">

    <table class="table table-striped">
        <thead>
        <tr jhiSort [(predicate)]="predicate" [(ascending)]="reverse" [callback]="transition.bind(this)">
        <th jhiSortBy="id"><span jhiTranslate="global.field.id">ID</span> <span class="fa fa-sort"></span></th>
        <th jhiSortBy="nombre"><span jhiTranslate="app.entity.name">Name</span> <span class="fa fa-sort"></span></th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let entity of entities ;trackBy: trackId">
            <td><a [routerLink]="['../entity', entity.id ]">{{entity.id}}</a></td>
            <td>{{entity.name}}</td>                               
        </tr>
        </tbody>
    </table>
</div>

Спасибо.

Answer 1

Мне удалось сделать это с помощью ввода и атрибута «purefilter» angular. Это было так, что:

<input type="text" [(ngModel)]="filter" class="form-control">

<table> 
......
    <tr *ngFor="let entity of (entities | pureFilter:filter:'name')>
.......

В pureFilter мы указываем 'pureFilter: nameOfFilter: attributeOfEntity'