FlexGrid - Bind column to a property of a list of Objects

FlexGrid - Bind column to a property of a list of Objects

Posted by: eveverad3 on 2 November 2018, 11:29 am EST

• 

  eveverad3

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 2 November 2018, 11:29 am EST

  Hello,

  I am Using Wijmo in Angular 7

  I have a grid that has a column called Names. The binding=“‘names’” is a list of strings.
  
  As per now the code below works fine: I can see the list of names separated by a comma and also in edit mode I can select/deselect names.

  
   <wj-flex-grid-column [binding]="'names'" [header]="'Names'" [width]="220" [dataType]="'Array'">
        <ng-template wjFlexGridCellTemplate [cellType]="'CellEdit'" let-cell='cell'>
          <wj-multi-select #namesMultiSelect [itemsSource]="usersList" [displayMemberPath]="'name'"
            [selectedValuePath]="'name'" (gotFocus)="namesGotFocus()"></wj-multi-select>
        </ng-template>
      </wj-flex-grid-column>
  
  

  The problem arises when in the binding I want to use a list of Objects (for example a user that has a Name and Age) and not a list of strings anymore.
  
  I still want to see only the name.

  I tried to write [binding]=“‘users.name’” but the result I get is: “[object Object], [object Object],”

  How can I retrieve the list of names from the list of object users?

  My question seems to be similar to this question (that has not received an answer yet)https://www.grapecity.com/en/forums/wijmo/flexgrid---bind-column-to-#wijmoarchiveokay-thanks-th

  Thanks

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 6 November 2018, 12:12 am EST

  Hi,

  Grid by default formats only list of primitive value types i.e strings, numbers, booleans, dates.
  
  If you want to display a more complicated list(list of objects), then you may write an angular pipe which would format list of object to required display string value.
  
  Please refer to the following sample which demonstrates the same:
  
  https://stackblitz.com/edit/angular-k6r7sm?file=src%2Fapp%2Flist-converter.pipe.ts

  Regards
  
  Sharad