我使用点击事件和一些简单的 javascript 完成了这项工作，但我确信有更好的方法。
我正在使用 ngFor 生成一些动态行和相应的动态按钮。
它们看起来像这样:
<div *ngFor="let section of data.order?.sections" id="{{section.class}}Detail" class="{{section.name | lowercase | removeAmpersand | removeSpaces }}">Random Text Here</div>
然后在页面的其他地方有一个也是使用 ngFor 生成的 anchor 标记列表:
<a (click)="showDetails($event)" id="{{section.name | lowercase | removeAmpersand | removeSpaces }}"><span class="icomoon icomoon-eye"></span> Detail/a>
我的问题是，显示和隐藏 div 的首选方式是什么？每个 div 都以 display: none 的 css 属性开始，我希望只是切换它。相反，我只是使用点击事件来运行一个获取 div id 的函数，然后我有一些看起来像这样的纯 javascript:
myDiv.style.display = myDiv.style.display === '' ? 'block' : '';
我应该怎么做才是首选方法？
最佳答案
您可以有条件地向您的元素添加 css 类。 有点像
<div class="standardclass" [class.additionalclass]="showFlag"></div>
其中 additionalclass 是另一个 css 类，只有当表达式 showFlag 为真时才会添加。它可以是任何 js 表达式，而不仅仅是一个标志。
您还可以使用 *ngIf 有条件地从 dom 中完全添加或删除元素。
搜索“Angular 2 模板语法”
关于html - 如何显示和隐藏由 Angular 2 中的动态按钮触发的动态 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38387037/