在我的 Angular 指令中,我尝试隐藏和显示手风琴面板。问题是,当我通过代码访问手风琴时,手风琴会中断。
例如,当我这样做时:
$("#collapseOne").collapse('hide')
面板已折叠,但标题中的链接不再起作用,因此用户无法展开面板。我也尝试过类似的事情:
$("#collapseOne").removeClass('in');
和
$("#collapseOne").hide();
但它们都不起作用。或者它们具有相同的效果,或者根本不起作用。
这是html:
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
Customer
</a>
</div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">
Customer list
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
My form
</a>
</div>
<div id="collapseTwo" class="accordion-body collapse">
<div class="accordion-inner">
<form novalidate data-ng-submit="certificateFormSubmit()">
Some form
</form>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
Title for other content
</a>
</div>
<div id="collapseThree" class="accordion-body collapse">
<div class="accordion-inner">
Some other content
</div>
</div>
</div>
</div>
这是我的指令的签名:
app.directive('certificateEdit', function ($q, ProductService, CustomerService, CertificateService) {
return {
restrict: 'E',
templateUrl: '/Certificate/Add',
scope: {
certificate: '=',
customerId: '=',
visible: '=',
onCertificateSaved: '&'
},
controller: function ($scope, $element, $attrs) {
// based on the certificate attribute value, I want to expand a accordion panel
});
我试图创建一个小提琴,但我无法让小提琴工作。我花了两个小时来创建一个小提琴,但我无法让指令起作用..