Rerender not change language

[attapanbank]

What versions you are using?

• node version: 7.10.0
• npm version: 4.6.1
• angular version: 4.3.6
• jquery version: 3.2.1
• datatables version: 1.10.16
• angular-datatables version: 4.2.0
• angular-cli version: 1.3.2

What's the problem?

I face the problem while I use rerender from your example but After destroy I modify to change language by get json language file before Trigger new render but it seems not work.

Can you share your code?

export class DatatablesComponent implements OnInit, AfterViewInit {

  @ViewChild(DataTableDirective)
  private dtElement: DataTableDirective;

  dtOptions: DataTables.Settings = {};

  dtTrigger: Subject<any> = new Subject<any>();

  lang: string = 'th';

  constructor() { }

  ngOnInit() {
    this.dtOptions = {
      data: [{
        id: '1',
        firstName: 'Hello',
        lastName: 'Moto'
      }],
      language: {
        url: `assets/language/datatables/${this.lang}.json`
      },
      columns: [{
        title: 'ID',
        data: 'id'
      }, {
        title: 'First name',
        data: 'firstName'
      }, {
        title: 'Last name',
        data: 'lastName'
      }]
    };
  }

  ngAfterViewInit() {
    this.dtTrigger.next();
  }

  public rerender(): void {
    this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {
      if (this.lang === 'th') {
        this.lang = 'en';
      } else {
        this.lang = 'th';
      }
      dtInstance.destroy();
      this.dtOptions.language = {
        url: `assets/language/datatables/${this.lang}.json`
      };
      this.dtTrigger.next();
    });
  }
}

<div class="box-body table-responsive no-padding">
  <table id="{{tableId}}" datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger" class="table table-striped table-bordered"></table>
</div>
<button (click)="rerender()">Rerender</button>

PS. I found that your example in rerender doesn't match with your example in github because it missing [dtTrigger] in your example. What should I follow ?

[poonamgp14]

yes, I am having the same issue. Rerender() doesn't work and throws an error for dtInstance being undefined.

[l-lin]

Yes, my bad, I forgot to add the dtTrigger in the example.

For your issue, I figured out why the language does not change.

I checked the content of the dtOptions after changing the attribute this.dtOptions.language.url = '...' . This is what I got:

Before DataTables 1.10, its settings for language was inside the property oLanguage.
DataTables seems to take the old attribute first. So you will need to either override the old attribute oLanguage.sUrl, or just delete it:

delete this.dtOptions['oLanguage'];
this.dtOptions.language.url = 'http://cdn.datatables.net/plug-ins/1.10.16/i18n/Bulgarian.json';

[attapanbank]

It works. Thank you. 👍