title: Hide child of component on click with duplicate component
body: <p>I would like when I click on the first  to have it show me ONLY HIS children , now when I click on either parent it automatically shows me ALL the children</p>
  <p>html:</p>
  <pre><code>&lt;app-menu-section [title]=&quot;'Save screenshot'&quot; (click)=&quot;updateClickStatus()&quot;&gt;
      &lt;app-menu-section [title]=&quot;'Button color'&quot; [class]=&quot;'menu-button'&quot; *ngIf=&quot;clicked&quot;&gt;&lt;/app-menu-section&gt;
  &lt;/app-menu-section&gt;
  
  &lt;app-menu-section [title]=&quot;'Edit screenshot'&quot; (click)=&quot;updateClickStatus()&quot;&gt;
      &lt;app-menu-section [title]=&quot;'Button color'&quot; [class]=&quot;'menu-button'&quot; *ngIf=&quot;clicked&quot;&gt;&lt;/app-menu-section&gt;
      &lt;app-menu-section [title]=&quot;'Background color'&quot; [class]=&quot;'menu-button'&quot; *ngIf=&quot;clicked&quot;&gt;&lt;/app-menu-section&gt;
  &lt;/app-menu-section&gt;
  </code></pre>
  <p>typescript (of menu-section):</p>
  <pre><code>import { Component, OnInit, ViewEncapsulation } from '@angular/core';
  
  @Component({
      selector: 'app-menu-container',
      templateUrl: './menu-container.component.html',
      styleUrls: ['./menu-container.component.css'],
      encapsulation: ViewEncapsulation.None
  })
  export class MenuContainerComponent implements OnInit {
      clicked: boolean = false;
  
      constructor() { }
  
      ngOnInit(): void {
      }
  
      updateClickStatus(): void {
          this.clicked = !this.clicked;
      }
  
  }
  </code></pre>
  <p>A component-only variable would be useful</p>