filter not working with ng-template

[Neha Singh]

I need to use filter in ejs-grid having ng-template. This column I am not able to filter.

Regards

Neha

<e-column field="emails" headerText="{{ 'notifications.emails' | translate }}" [allowEditing]='true' textAlign='left'>

        <ng-template #template let-data class="show">

          <div *ngIf="!data.showAll">

            <label class="email-label" *ngFor="let email of data.emailsCollapsed">{{email}}</label>

            <a *ngIf="data.showMoreButton" (click)="showMore(data)" class="email-show-more-less">{{'notifications.showMore' | translate : { count: data.showMoreCount} }}</a>

          </div>

          <div *ngIf="data.showAll">

            <label class="email-label" *ngFor="let email of data.emails">{{email}}</label>

            <a *ngIf="data.showMoreButton" (click)="showLess(data)" class="email-show-more-less">{{'notifications.showLess' | translate}}</a>

          </div>

        </ng-template>

        <ng-template #editTemplate let-data>

          <label class="email-label" *ngFor="let email of data.emails; index as i">

            {{email}}

            <a (click)="removeEmail(data, i)" class="email-remove">X</a>

          </label>

            <input type="email" email id="email"

                   name="email" ngModel #emailRef="ngModel">

            <a type="button" [class.disabled]="!emailRef.value || (emailRef.errors && (emailRef.touched || emailRef.dirty))"

               (click)="addEmail(data, emailRef)" class="email-add">+</a>

        </ng-template>

      </e-column>

[Rajapandiyan Settu]

Hi Neha, 

 

Thanks for contacting Syncfusion support. 

 

By analyzing your code example, we could see that you are using array of object value for the emails column and you want to perform Filtering on it. Before proceeding with your query we would like to share the behavior of EJ2 Grid Column. 

 

By default, the EJ2 Grid column only supports number, string, date, dateTime, Boolean, checkbox type values, and which does not supports array type value. Refer to the below documentation. 

 

UG: https://ej2.syncfusion.com/documentation/api/grid/columnType/  

 

We can show an array of values in the Grid column (using the valueAccessor API and by iterating each array value in columnTemplate feature). But this is used only for the display purpose. We cannot perform Grid actions like Filtering, Searching, Grouping, Sorting, etc., on the array type column. This is the behavior of EJ2 Grid. 

 

Note: 

The Grid data actions like Filtering, Sorting, Formatting, Searching, Grouping, etc., are performed with the Grid’s dataSource value based on its column field name. 

 

Please let us know if you have any concerns. 

 

Regards, 

Rajapandiyan S