Javascript 使用纯java脚本将切换函数仅应用于单击的元素

这是我显示数据的html代码

<ul id="menu">
<li *ngFor="let category of componentContents.dashboardMenu;let i = index" >
    <p (click)="toggle_visibility()"class="parent-menu">{{category.category}</p>
    <ul id="{{(category.category).split(' ').join('-')}}" class="toggled" 
        *ngIf="category.subCategory.length > 0" style="display:none">
        <li *ngFor="let subCat of category.subCategory"> 
            <a routerLink={{subCat.router}} routerLinkActive="active"  
            {{subCat.subcategory}}</a>
        </li>
    </ul>
</li>

{{category.category}



你应该使用

[style.display]="e[i].style.display == '' ? 'none' : 'block'"

其中
e
是一个数组，其项数与
componentContents.dashboard菜单
正确格式化代码会有很大帮助；-）您应该使用
[style.display]=“e[i].style.display==“block”？“（block”）
而不是在代码中执行。谢谢，但此代码应用于所有单击的p元素。我如何才能使其仅在单击的元素上工作您读取和访问DOM的方式完全与在角度中执行DOM的方式相反。请参见下面的回答。将索引传递到
切换可见性
，并在数组。如何访问e内部切换函数？
e
必须是一个布尔数组，其大小与
componentContents相同。仪表板菜单
无需访问DOM，因为您知道在components类中，
componentContents的大小将包含多少元素。仪表板菜单
请编辑您的问题然后添加您现在拥有的代码。
[style.display]="e[i].style.display == '' ? 'none' : 'block'"

(click)="toggle_visibility(i)"

toggle_visibility(i) {
  this.e[i] = !this.e[i];
}