在组件初始化时执行 [kendoGridAddCommand]答案

【问题标题】：Execute [kendoGridAddCommand] on component init在组件初始化时执行 [kendoGridAddCommand]
【发布时间】：2018-09-17 09:11:40
【问题描述】：

Kendo Default Behaviour

add 事件在点击kendoGridToolbarTemplate 下的kendoGridAddCommand 时触发。

HTML：

<kendo-grid 
(add)="addHandler($event)"
>
    <ng-template kendoGridToolbarTemplate>
        <button kendoGridAddCommand>Add new</button>
    </ng-template>
    <kendo-grid-column field="id" title="ID" width="120"></kendo-grid-column>
    <kendo-grid-column field="name" title="name" width="120"></kendo-grid-column>
</kendo-grid>

TS：

protected addHandler({sender}) {
    // define all editable fields validators and default values
    const group = new FormGroup({
        'id': new FormControl(),
        'name': new FormControl()
    });

    // show the new row editor, with the `FormGroup` build above
    sender.addRow(group);
}

要求

在组件初始化或网格外部触发addrow 事件。默认情况下，表单控件应显示一行，而无需单击 Add new 按钮。

尝试以下 SO 中提供的解决方案，但没有成功。

KendoUI Angular Grid external command

任何帮助都将不胜感激。谢谢

【问题讨论】：

标签： angular kendo-ui kendo-grid angular5 kendo-angular-ui

【解决方案1】：

您可以处理 AfterViewInit 事件，并调用 Grid addRow method，例如：

ngAfterViewInit() {
  this.formGroup = new FormGroup({
        'ProductID': new FormControl(),
        'ProductName': new FormControl('', Validators.required),
        'UnitPrice': new FormControl(0),
        'UnitsInStock': new FormControl('', Validators.compose([Validators.required, Validators.pattern('^[0-9]{1,3}')])),
        'Discontinued': new FormControl(false)
  });

  this.grid.addRow(this.formGroup);
}

EXAMPLE

【讨论】：