Question

我正在使用Syncfusion Angular UI组件（Essential JS 2）中的网格组件（ejs-grid）。

一个问题是，使用列模板时，无法从数据源访问当前行的原始对象。这就是为什么在Stackblitz中的单元格中单击黑色正方形之后，网格下方的输出为：

是否相同：false

let-data变量不保存数据源中的原始对象，而是保留它的某些副本。

HTML模板：

<ejs-grid [dataSource]='data' rowHeight='38' height='200' width="300">
    <e-columns>
        <e-column field='name' headerText='Employee Name' width='200'>
            <ng-template #template let-data>
                <div>
                    <span>{{ data.name }}</span>
                    <span>{{ data.testFunc() }}</span>
                    <span
                        (click)="onClick(data)"
                        class="clickable">
                    </span>
                </div>
            </ng-template>
        </e-column>
    </e-columns>
</ejs-grid>
<div>Is the same: {{ isTheSame !== undefined ? isTheSame : 'undefined' }}</div>

TypeScript组件代码：

export class Item {
    public constructor(public readonly name: string) {
    }

    public testFunc(): string {
        return "testFunc " + this.name;
    }
}

@Component({
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css'],
    providers: [FilterService,VirtualScrollService]
})
export class AppComponent {
    public data: ReadonlyArray<any> = [new Item("Name1")];

    public isTheSame: boolean | undefined;

    public onClick(dataItem: any): void {
        this.isTheSame = dataItem === this.data[0];
    }
}

除了let-data之外，还有其他变量可以绑定列模板以获取原始行数据吗？如果没有，什么解决方法？
有人可以指出包含所有可用于列模板的变量列表的docs \ Gitub源吗？除let-data：let-clientData以外，我至少知道一个。

Answer 1

默认情况下，列模板呈现与行数据一起提供其他详细信息（如列对象，索引等）。此详细信息用于根据用户方案自定义模板列。因此，在将此对象与data[0]进行比较时，它始终会失败。

访问网格列模板中的行数据源对象

1 个答案: