InnerHTML div пропущен после скрытия div ⇐ CSS

[Гость]

Я использую Angular 17 и Tailwind, моя директива добавляет и удаляет «скрытый» в классе отмеченного при проверке ситуации выбора/отмены выбора флажка. Моя проблема в том, что внутренний HTML отмеченного удаляется при выполнении этой директивы.

Код: Выделить всё

import {
Directive,
ElementRef,
Input,
HostListener,
Renderer2,
} from '@angular/core';

@Directive({
selector: '[checkBoxAccordionTrigger]',
standalone: true,
})
export class CheckBoxAccordionDirective {
@Input('checkBoxAccordionTrigger') triggerId!: any;

constructor(private el: ElementRef, private renderer: Renderer2) {}

@HostListener('change') onChange() {
const accordionBodyElement = this.renderer.selectRootElement(
`[accordion-body="${this.triggerId}"]`
);

if (this.el.nativeElement.checked) {
// this.renderer.removeClass(accordionBodyElement, 'hidden');
this.renderer.removeStyle(accordionBodyElement, 'display');
} else {
// this.renderer.addClass(accordionBodyElement, 'hidden');
this.renderer.setStyle(accordionBodyElement, 'display', 'hidden');
}
}
}

Код: Выделить всё

{{i+1}} - {{departmentDemand.DepartmentName }} :



{{ demand.Name }}


{{ parameter.Name }} :

Я пытался изменить стиль отмеченного с блочного на нет, но это не работает.

Подробнее здесь: https://stackoverflow.com/questions/781 ... hiding-div