我在纯 html 页面中实现了可折叠，如下所示：<!DOCTYPE html><html><head> <title></title><style>button.accordion { background-color: #777; color: white; cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px;}button.accordion.active, button.accordion:hover { background-color: #555;}button.accordion:after { content: '\002B'; color: white; font-weight: bold; float: right; margin-left: 5px;}button.accordion.active:after { content: ''; background-image: url('download.jpg'); display: inline-block; background-size: 30px 30px; width:30px; height:30px; transform:rotate(180deg);}div.panel { padding: 0 18px; background-color: #f1f1f1; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out;}* { box-sizing: border-box;}#myUL { list-style-type: none; padding: 0; margin: 0;}a{ text-decoration: none; color:white;}</style></head><body><h2>Collapsible</h2><p>Click the button to toggle between showing and hiding the collapsible content.</p><div id="div2"><button class="accordion"><a href="#">Addq</a></button><div class="panel"> <p>Some collapsible content. Click the button to toggle between showing and hiding the collapsible content. Lorem ipsum dolor sit amet,ome Some collapsible content. Click the button to toggle between showing and hiding the collapsible content. </p><button class="accordion"><a href="#">Aollapsible</a></button><div class="panel"> <p>sdfsdfsdfsdt amet,ome Some collapsible content. Click the button to toggle between showing and hiding the collapsible content. </p></div><button class="accordion"><a href="#" style="">Dollapsible</a></button>JS小提琴：https : //jsfiddle.net/c2r70eh6/4/但是当我在 angular 应用程序中编写相同的代码时，可折叠的不会扩展。在用 Angular 编写时-我将 html 代码放入该组件的 html 文件中，将 CSS 放入该组件的 css 文件中，并将 JS 复制到 index.html 文件中。它在简单的 html 文件中工作正常。但不是有角度的。我检查了所有的ID，它们都是正确的。需要你的帮助。提前致谢！
添加回答
举报
0/150
提交
取消