ngx-datatable:如何在一行中的对象上显示 属性 的值

ngx-datatable: How to display value of a property on a object in a row

我在 ngx-datatable 中遇到一些基本问题。

在 angular-cli 应用程序中,我将一个包含 3 个元素的数组绑定到 table 并显示 3(空)行。当我单击一行时,我正确地得到了我绑定该行的对象。我用这个 http://swimlane.github.io/ngx-datatable/#single-selection 作为起点

这是 UI 中的样子。 属性 StockName 的值应该打印在每一行中。但事实并非如此,但是 select 行的值正确显示在 table.

下方

 <ngx-datatable
        class="material"
        [rows]="rows"
        [columnMode]="'force'"
        [columns]="columns"
        [headerHeight]="0"
        [footerHeight]="0"
        [rowHeight]="'auto'"
        [limit]="5"
        [selected]="selected"
        [selectionType]="'single'"           
        (select)='onSelect($event)'>
        <ngx-datatable-column name="StockName">                  

                <ng-template let-value="value" ngx-datatable-cell-template>          
                  StockName is: '{{value.StockName}}'          

                </ng-template>

              </ngx-datatable-column>
      </ngx-datatable>

    <p>############</p>
    <div class='selected-column'>
            <h4>Selections</h4>        
            <ul>        
              <li *ngFor='let sel of selected'>        
                Selected StockName is: {{sel.StockName}}       
              </li>        
              <li *ngIf="!selected">No Selections</li>        
            </ul>        
          </div>

这是向 table

添加行的代码
rows: Array<TradingConfiguration> = Array<TradingConfiguration>();
selected: Array<TradingConfiguration> = Array<TradingConfiguration>();

colums: any[] = [ { prop: 'StockName' } ];

// Add row to table
addRows(tradingConfigurations: Array<TradingConfiguration>) {

if (tradingConfigurations != null && tradingConfigurations.length > 0) {

  for (var i = 0; i < tradingConfigurations.length; i++) {
    if (tradingConfigurations[i].IsActive == this.showActive){
      // Add a new row to the table
      this.rows.unshift(tradingConfigurations[i]);
      this.rows = this.rows.slice();
     }        
   }
 }
}

我成功了:)

我需要将其更改为:

colums: any[] = [ { prop: 'StockName' } ];

至:

 { name: 'StockName', prop: 'StockName' }

并删除:

<ngx-datatable-column name="StockName">                  

            <ng-template let-value="value" ngx-datatable-cell-template>          
              StockName is: '{{value.StockName}}'          

            </ng-template>

          </ngx-datatable-column>