在Angular 4中创建具有切换子组件的组件

我正在尝试创建一个包含多个div的组件。当您按下下面链接中的jQuery toggle（）方法中的按钮时，html和一些div会被向下切换： 我尝试了图片下面的代码，但它不起作用（我使用的是PrimeNg库，但我确信它可以不用）。 根据图片（很抱歉，这是一个非常丢脸的例子，但仅举一个例子），所以我想当我单击按钮1、2、3、4或5时，它会打开div，然后如果我再次单击，我会缩小div。不使用JQuery的最佳方法是什么

Appliv2Component.ts：

export class AppliV2Component   { 


   @ViewChild('DisplayChildComponent') private changeComponent: DisplayChildComponent;

}

  display() {
        this.changeComponent;
        }

Appliv2Component.html：

<button pButton class="daydetail" type="button" label="Click" icon="fa-chevron-up" (onClick)="display()"></button>