1

I have an array of string, that I am trying to convert to an array of objects, on order to dynamically create a mat table, using the guide on the Angular Material Website

Stackblitz example from Angular Material, but they're not really doing it dynamically, as their columns are manually typed in the component

columnsToDisplay: string[] = [
                                'log_id',
                                'computer_id',
                                'processor_test',
                                'display_test',
                                'storage_test',
                                'network_test',
                                'keyboard_test',
                                'mouse_test',
                                'userfields',
                                'hard_disk_id',
                                'start_time',
                                'hard_disk_serial',
                                'gigabytes',
                                'target_drive_detailed',
                                'drive_detailed',
                                'target_drive',
                                'pattern_name',
                                'wipe_status',
                                'errors',
                                'dirty_sectors',
                                'tool',
                                'kernel',
                                'job_uuid',
                                'uuid',
                                'end_time',
                                'end_time_short',
                                'num_passes',
                                'trim_passes',
                                'sectors_overwritten',
                                'sectors_not_overwritten',
                                'sectors_verified',
                                'custom_field_legacy',
                                'nis_method_type',
                                'dco_foundremoved',
                                'dco_locked',
                                'hpa_foundremoved',
                                'amax_foundremoved',
                                'vendor',
                                'chassis',
                                'computer_model',
                                'computer_serial',
                                'computer_summary',
                                'motherboard_summary',
                                'cpu_summary',
                                'nic_summary',
                                'display_summary',
                                'usb_ports',
                                'computer_memory',
                                'hard_disk_drive_media_type',
                                'hard_disk_product',
                                'hard_disk_vendor',
                                ];
this.columnsToDisplay.forEach((field: string) => {
      const selected: boolean = this.displayedColumns.some((column: string) => column === field);
      this.columnSelection.push({
        value: field,
        viewValue: field.toUpperCase().replace('_', ' '),
        selected: selected,
        cell: (element: ErasureModel) => `${element.[field]}
      })
    });

Obviously it is the element.[field] that is not working

Is it at all possible to generate this, so that for the field log_id I could have it say element.log_id?

catu
  • 888
  • 6
  • 24
  • 2
    `element[field]` (no dot). see: [Property accessors: bracket notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors#bracket_notation) – pilchard May 27 '22 at 07:48

0 Answers0