---
title: "Comment by mariane habdichlieb on \"A simple but customizable accordion component in Angular\" | Hashnode"
description: "is it possible to be an accordion item expanded when the component is shown?"
url: "https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9/comment/63ecf62b3fa8ff4ff009775d"
---

[Discussion](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9)

Comment [A simple but customizable accordion component in Angular](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9)

[mariane habdichlieb](https://hashnode.com/@mariane)

[Feb 15, 2023](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9/comment/63ecf62b3fa8ff4ff009775d)

is it possible to be an accordion item expanded when the component is shown?

[Adithya Sreyaj](https://hashnode.com/@adisreyaj)

[Feb 22, 2023](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9/comment/63ecf62b3fa8ff4ff009775d#reply-63f6579e437bc8d091bd0c41)

Can you rephrase your question? I don't quite follow.

[Leonardo](https://hashnode.com/@Leonardonline)

[Feb 27, 2023](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9/comment/63ecf62b3fa8ff4ff009775d#reply-63fd31385b969e24bab6e597)

[Adithya Sreyaj](https://hashnode.com/@adisreyaj) looks like asking for initially open items.

[Adithya Sreyaj](https://hashnode.com/@adisreyaj)

[Feb 28, 2023](https://hashnode.com/posts/customizable-accordion-component-angular/60c451bea25fa357af8409d9/comment/63ecf62b3fa8ff4ff009775d#reply-63fdbb42c72bc5248ac263ad)

I've update the code to add support for initial expand conditions:

```
merge(this.items.changes, of(this.items))
      .pipe(map(() => this.items.toArray()))
      .subscribe((items) => {
        items.forEach((item, index) => {
          if (item.expanded) {
            this.expanded.add(index);
          }
        });
        this.cdr.detectChanges();
      });
```