Currently, I am working on the following code snippet:
<GridLayout columns="*, *">
<Label text="Question" textWrap="true" (tap)="onTap(0)" class="h2 que" col="0"></Label>
<Label class="fas h1 icon" text="" col="2" colSpan="3"></Label>
<Label class="fas h1 icon" text="" col="2" colSpan="3"></Label>
</GridLayout>
Accompanied by its respective .ts
:
import { Component, OnInit } from '@angular/core';
import { RadSideDrawer } from 'nativescript-ui-sidedrawer'
import { Application } from '@nativescript/core'
@Component({
selector: 'faqs',
templateUrl: './faqs.component.html',
styleUrls: ['./faqs.component.css']
})
export class FaqsComponent implements OnInit {
isToggled = [false, false, false, false]
constructor() { }
ngOnInit() { }
onDrawerButtonTap(): void {
const sideDrawer = <RadSideDrawer>Application.getRootView()
sideDrawer.showDrawer()
}
onTap(index: number) {
this.isToggled.fill(false, 0)
this.isToggled[index] = !this.isToggled[index]
}
}
I would like the
<Label class="fas h1 icon" text="" col="2" colSpan="3"></Label>
to be displayed when the <Label text="Question" textWrap="true" (tap)="onTap(0)" class="h2 que" col="0"></Label>
is tapped, similar to how an accordion works. Thank you in advance for any help provided!