Change or remove default message "No cards to display".

[Mauricio]

Hi,

After updating to the most recent version of Syncfusion, the kanban shows the phrase "No cards to display", where there are no cards, I didn't find how to remove or change this phrase. Can you show me how can I do that?

Thanks,

Mauricio.

[Ravikumar Venkatesan]

Hi Mauricio, 

Greetings from Syncfusion support. 

We have validated your requirement at our end and achieved it by replacing the default text content with the empty string with the help of the load function of the L10n class and for the same, we have prepared a sample that can be available from the below link. 

Sample: https://stackblitz.com/edit/ej2-angular-kanban-with-empty-swimlanes-sample-with-loca-lhts22?file=app.component.ts 

 

[app.component.ts] 

import { extend, addClass, L10n } from "@syncfusion/ej2-base"; 

 

L10n.load({ 

  "en-US": { 

    kanban: { noCard: "" } 

  } 

}); 

 

UG(Localization in Angular Kanban component): https://ej2.syncfusion.com/angular/documentation/kanban/localization/#globalization 

Kindly try the above sample and get back to us if you need any further assistance. 

Regards, 

Ravikumar Venkatesan 

[Sujeet Jaiswara]

You can also hide by css

<ejs-kanban #kanbanObj cssClass='kanban-overview'...

.kanban-overview ::ng-deep  .e-empty-card {

  display: none;

}

[Nevitha Ravi]

Hi Sujeet, 

Thanks for your suggestion..! yes we can hide it using CSS also. 

Regards, 

Nevitha 

[Adrian Rodriguez]

Hello team,

Is there any way to can change the unassigned tag to other language on swimlaneSettings?

Thanks

[Indrajith Srinivasan]

Hi Adrian, 

 

Greetings from Syncfusion support, 

 

We have validated your reported query. You can achieve your requirement, using the Swimlane templates before showing the keyField in the Kanban rows. We have also prepared a sampla that tries to meet your requirements. 

 

Code blocks:  

 

 

<div class="e-swimlane-row-text"> 

      <span *ngIf="data.textField !== 'Unassigned' else yourSpanishText">{{data.textField}}</span> 

     <ng-template #yourSpanishText> 

       no asignado 

     </ng-template> 

 </div> 

 

Sample: https://stackblitz.com/edit/angular-hlgecf-cge5fn?file=app.component.html 

 

Documentation: https://ej2.syncfusion.com/angular/documentation/kanban/swimlane/#template 

 

Please let us know if the solution helps, 

 

Regards, 

Indrajith