Невозможно связать с «extendedHeight», поскольку оно не является известным свойством «mat-accordion»

Question

Я столкнулся с этой проблемой, и не было никакого соответствия с ответом, поэтому я подумал, что опубликую это.

Эта проблема возникает при использовании аккордеона Angular Material и попытке использовать свойство extendedHeight для настройки высоты аккордеона. Появляется ошибка:

Can't bind to 'expandedHeight' since it isn't a known property of 'mat-accordion'.

Код может выглядеть так:

<mat-accordion [expandedHeight]="'2em'">
    <mat-expansion-panel-header>
        <mat-panel-title>{{ headerText }}</mat-panel-title>
    </mat-expansion-panel-header>
    {{ content }}}
</mat-accordion>

Answer 1

Решение в этом случае простое.Обратите внимание, что extendedHeight относится к HEADER, а не к аккордеону.Поэтому исправление заключается в перемещении атрибута на компонент панели.

<mat-accordion>
    <mat-expansion-panel-header [expandedHeight]="'2em'">
        <mat-panel-title>{{ headerText }}</mat-panel-title>
    </mat-expansion-panel-header>
    {{ content }}}
</mat-accordion>