在Angular 2 Kendo网格中替代detailinit事件

在Angular 2 Kendo网格中，当用户打开详细模板时，我需要在每个单元格中显示其他信息。在Kendo Grid for jQuery中，我可以使用detailinit（http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-detailInit）事件来完成我所需要的事情，但是，Angular2组件中没有这样的事件。在Angular 2 Kendo网格中替代detailinit事件

<kendo-grid-column> 
     <template kendoCellTemplate let-dataItem let-rowIndex="rowIndex"> 
      {{rowIndex}} 
      <div *ngIf="????"> 
       Need to show this text when detail template is visible 
       and hide when it's hidden 
      </div> 
     </template> 
    </kendo-grid-column> 
    <template kendoDetailTemplate let-dataItem> 
     <section *ngIf="dataItem.Category"> 
     <header>{{dataItem.Category?.CategoryName}}</header> 
     <article>{{dataItem.Category?.Description}}</article> 
     </section> 
    </template>

Here is an example我需要什么（请在单元格中的文本）。

来源

2016-12-30 Pavel Kavalenka

欢迎来到Stack Overflow！要求我们推荐或查找书籍，工具，软件库，教程或其他非现场资源的问题与Stack Overflow无关，因为它们倾向于吸引自以为是的答案和垃圾邮件。相反，[描述问题]（http://meta.stackoverflow.com/questions/254393）以及迄今为止已经做了什么来解决它。 –

@JoeC这个问题不是关于建议，而是关于如何使用Kendo UI的Angular 2 –

此时，Angular 2网格不提供详细模板是否展开的信息。请随时致电suggest this as a feature request。

HACK：破解解决此限制，可以从HTML推断扩张状态。

请参阅this plunkr。

private icons(): any[] { 
    const selector = ".k-master-row > .k-hierarchy-cell > .k-icon"; 
    const icons = this.element.nativeElement.querySelectorAll(selector); 

    return Array.from(icons); 
} 

private saveStates(): void { 
    this.states = this.icons().map(
    (icon) => icon.classList.contains("k-minus") 
); 
} 

private isExpanded(index): bool { 
    return this.states[index] || false; 
}

尽管这样做有效，但它远非理想，并且违背了Angular哲学，并可能在渲染更改时断裂。

来源

2017-01-02 09:38:26

Alex的网格组件获得特定结果，感谢您的回答。我刚刚创建了自己的展开式行功能实施并提交了功能请求。现在我将等待kendo发布详细模板事件实现，以重构我的代码并使用本地kendo功能。 –

功能请求[链接]（http://kendoui-feedback.telerik.com/forums/555517-kendo-ui-for-angular-2-feedback/suggestions/17602957-detail-row-events-in-grid） –

在Angular 2 Kendo网格中替代detailinit事件

回答

相关问题