Question

通常，当我为每列使用单独的kendo-grid-column标记时，我可以轻松地为任何特定列提供[width]和ng模板如何使用ngFor kendo网格角为特定列提供宽度和ng模板2？以https://www.telerik.com/kendo-angular-ui/components/grid/columns/

中的kendo文档为例

@Component({
  selector: 'my-app',
  template: `
      <kendo-grid
        [kendoGridBinding]="gridData"
        [filterable]="true"
        scrollable="none"
        >
        <kendo-grid-column
          *ngFor="let column of columns"
          field="{{column.field}}"
          title="{{column.title}}"
          format="{{column.format}}"
          filter="{{column.type}}"
        ></kendo-grid-column>
      </kendo-grid>
  `
})
export class AppComponent {
  public gridData: any[] = sampleProducts;

  public columns: ColumnSetting[] = [
    {
      field: 'ProductName',
      title: 'Product Name',
      type: 'text'
    }, {
      field: 'UnitPrice',
      format: '{0:c}',
      title: 'Unit Price',
      type: 'numeric'
    }, {
      field: 'FirstOrderedOn',
      format: '{0:d}',
      title: 'First Ordered',
      type: 'date'
    }
  ];
}

在上面生成列的方法中，我希望将ng模板和宽度用于某些特定列。如果我在kendo-grid-column标记内写，它将适用于所有列，但我只希望它适用于特定列。我怎么能这样做？

Answer 1

您也可以使用与其他属性相同的方法 - 只需在列数组中的相应对象中提供宽度属性：

<kendo-grid-column
          *ngFor="let column of columns"
          field="{{column.field}}"
          title="{{column.title}}"
          format="{{column.format}}"
          filter="{{column.type}}"
          width="{{column.width}}"
        ></kendo-grid-column>

public columns: ColumnSetting[] = [
    {
      field: 'ProductName',
      title: 'Product Name',
      type: 'text'
    }, {
      field: 'UnitPrice',
      format: '{0:c}',
      title: 'Unit Price',
      type: 'numeric',
      width: 300
    }, {
      field: 'FirstOrderedOn',
      format: '{0:d}',
      title: 'First Ordered',
      type: 'date'
    }
  ];

UPDATED EXAMPLE

使用ngFor kendo grid angular 2为特定列提供宽度和ng模板？

1 个答案: