Grid edit changes ngTemplate's ngClass after row is updated

[Ervin van der Merwe]

The grid row seems to get re-rendered and changes the ngClass's value when the edit gets saved only. How can we prevent this?

    <e-column headerText='Actions' [allowEditing]='false' width=120>

      <ng-template #template #editTemplate let-data>

        <div class="d-flex justify-content-start align-items-center">

          <span class="mr-4">

            <a class="action-link-btn action-link-btn-appr" [ngClass]="{'disabled': data.IsApproved != null}"

              [routerLink]="" (click)="SetApproval(true, data)" title="Approve">

              <div class="d-flex flex-column justify-content-center align-items-center">

                <span><i class="fav-ico far fa-lg fa-thumbs-up"></i></span>

                <span>Approve</span>

              </div>

            </a>

          </span> 

     </ng-template>

   </e-column>

[Balaji Sekar]

Hi Ervin, 

 

Greetings from Syncfusion support. 

 

By default, once cell is edited and updated , corresponding row (tr) will be re-rendered with updated data and row edit Template data will be compared with required ngclass condition and class will be added to the element. Its default behavior. If you want to prevent this kind of class after save action you have remove ngclass in template element.  

 

If we misunderstood your requirement please explain briefly to quick response. 

 

Please get back to us, if you need any further assistance. 

 

Regards, 

Balaji Sekar.