bootstrap складная панель не работает внутри нг-если

Question

Я использую bootstrap складную панель с angular js. Но когда я положил свою разборную панель внутрь div и добавил ng-if не работает разборная панель.

User <input type="checkbox" ng-model="isUser"/>

<div class="col-md-12" ng-if="!isUser">
                 <div class="panel-group driving-license-settings" id="accordion">
                                            <div class="panel panel-default">
                                                <div class="panel-heading">
                                                    <h4 class="panel-title"> </h4>
                                                    <div class="checkbox" id="testCheckBox">
                                                        <label data-target="#collapseOnes">
                                                            <input type="checkbox" ng-model="a"/> I have Driver License  
                                                        </label>
                                                    </div>
                                                </div>
                                                <div id="collapseOnes" class="panel-collapse collapse in eh">
                                                    <div class="panel-body">
                                                        <div class="driving-license-kind">
                                                         content
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>  
</div>

Я использую ниже jquery код для моей складной области

    $('.collapse').collapse();
$("input[type='checkbox']").bind('click dblclick', function(evt) {
    if ($(this).is(":checked")) {
        $(this).parents('.panel-group').find('.collapse').slideDown('fast');
    } else {
        $(this).parents('.panel-group').find('.collapse').slideUp('fast');
    }
})

, когда я удаляю условие 'ng-if', складная панель работает хорошо. Вы можете помочь мне решить эту проблему? мы не можем использовать bootstrap складную панель внутри 'ng-if'.

Answer 1

Звучит так, как будто вы jquery звоните до того, как ваш collapsible panel будет обработан.

Я полагаю, $(this).parents('.panel-group').find('.collapse') ничего не вернет.

Напоминаем, ng-if не отображает DOM вообще.

• Быстрое решение состоит в том, чтобы перейти к ng-show
• Другое решение - вызвать код jquery, когда isUser будет ложным.

---

Я предлагаю вам не смешивать angular js с jquery, плохая практика.

У вас есть bootstrap для angular js: https://angular-ui.github.io/bootstrap/#! # Распад