Custom value/text fields not working, always expecting id/name for value/text fields

[skaluva]

Hi, I followed the document. I'm using code as shown below: In component.ts file, defined property like this:

fes = [{
    'id': 'pp',
    'name': 'pp'
  }, {
    'id': 'bz',
    'name': 'bz'
  }];

In component.html, defined like this:

    <div class="row">
        <div class="col-md-8 col-md-offset-2">
          <ng2-dual-list-box [data]="fes" valueField="id" textField="name"
                             (onAvailableItemSelected)="log($event)"
                             (onSelectedItemsSelected)="log($event)"
                             (onItemsMoved)="log($event)"></ng2-dual-list-box>
        </div>
      </div>

This is working as expected.

But if i define, custom valueField & textField properties. Its not taking those custom fields instead always expecting id/name in data.

In component.ts file, defined property like this:

fes = [{
    'fId': 'pp',
    'fName': 'pp'
  }, {
    'fId': 'bz',
    'fName': 'bz'
  }];

In component.html, defined like this:

<div class="row">
        <div class="col-md-8 col-md-offset-2">
          <ng2-dual-list-box [data]="fes" valueField="fId" textField="fName"
                             (onAvailableItemSelected)="log($event)"
                             (onSelectedItemsSelected)="log($event)"
                             (onItemsMoved)="log($event)"></ng2-dual-list-box>
        </div>
</div>

Its not working. List boxes are not getting rendered. I'm getting below exception chrome's dev console:

When i debugged the code in chrome, this plugin ignoring custom values defined for valueField and textField properties in component.html. Instead, it always expecting valueField="id" and textField="name". Check below screenshot:

Are custom values supported for valueField and textField ?? Or am i doing anything wrong?