代码之家 › 专栏 › 技术社区 › A_J

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

kendo-grid angular

A_J · 技术社区 · 6 年前

通常当我使用单独的 kendo-grid-column 我可以轻松给出的每一列的标签 [width] 任何特定列的ng模板如何使用ngFor kendo grid ANGLACH 2为特定列提供宽度和ng模板?以剑道文档为例 https://www.telerik.com/kendo-angular-ui/components/grid/columns/

@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'
    }
  ];
}

剑道网格柱 标记,它将适用于所有列,但我只希望它适用于特定列。我该怎么做?

1 回复 | 直到 6 年前

topalkata 6 年前

您也可以使用与其他属性相同的方法-只需从柱阵列:

<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

推荐文章

Kiara · 根据条件角度显示多个模板

11 月前

IonicMan · 剑道网格在宽度过大时不显示某些列

11 月前

Piotr Deja · 如何在subscribe方法中为参数赋值,然后从组件内部的任何位置检索该值?

11 月前

Ben5 · 服务器端总是接触FormControl

1 年前

allforthenoob · 我该怎么分类?

1 年前

Hamid Elouardaoui · 角度生成:发生未处理的异常:服务不再运行

1 年前

Hugh Jones · 如何创建适用于多个来源的自签名开发证书

1 年前

jthorn · 角度对象未在HTML中显示

1 年前

clem · 如何在Angular应用程序中突出显示页面的一部分?

1 年前

Kael · 在html表格中显示关系api数据-角度

1 年前