Альтернатива событию detailinit в Angular 2 Kendo grid

В угловой сетке 2 Kendo мне нужно показать дополнительную информацию в каждой ячейке, когда пользователь открывает шаблон сведений.
В сетке кендо для jQuery я мог бы использовать detailinit ( http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-detailInit ) событие для выполнения того, что мне нужно, однако, нет такого события в компоненте Angular2.

    <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>

Вот пример того, что мне нужно (см. текст в ячейках).

1 ответ

  1. В это время угловая сетка 2 не предоставляет информации о том, развернут шаблон сведений или нет. Не стесняйтесь предложить это в качестве запроса функции .

    HACK: чтобы обойти это ограничение, вы можете вывести расширенное состояние из HTML.

    Смотрите это 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;
}

    В то время как это работает, это далеко от идеала, и идет против угловой философии, и может сломаться при отображении изменений.