угловой коллапсВсе не работает

Я использовал плагин начальной загрузки, чтобы свернуть и развернуть файл <div>s. Я могу сделать это для отдельных <div>, но если я оставлю один <div> развернутым и сделаю collapseAll(), расширенный <div> только свернется. Пожалуйста, дайте мне решение по этому поводу

HTML:

<body ng-controller="MainCtrl">
    <div class="panel panel-default" ng-repeat="item in items">
        <div class="panel-heading" ng-click="isCollapsed = !isCollapsed">{{item.title}}</div>
        <div class="panel-body" collapse="isCollapsed">{{item.content}}</div>
    </div>
    <div>
        <input type="checkbox" id="collapse_all_cards" ng-model="isCollapsed"><label for="collapse_all_cards">Collapse All</label>
    </div>
</body>

js:

var app = angular.module('plunker', ['ui.bootstrap']);

app.controller('MainCtrl', function($scope) {
    $scope.items = [{'title':'Item1','content':'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus maximus orci sodales, pellentesque urna eu'},
                {'title':'Item2','content':'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus maximus orci sodales, pellentesque urna eu'},

                 {'title':'Item3','content':'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus maximus orci sodales, pellentesque urna eu'}

            ]
});

ссылка: http://plnkr.co/edit/mcnqeLJcTyaAuTI9JHb9


angularjs angular-bootstrap
person user1153484    schedule 17.04.2015    source источник

Ответы (1)


arrow_upward
2
arrow_downward

См. этот планк

Почти уверен, что это то поведение, которое вам нужно :)

Раньше проблема заключалась в том, что одно и то же свойство «isCollapsed» в области видимости использовалось для «свернуть все», и отдельные объекты рушились, поэтому они сбивали друг друга с толку.

См. новый код контроллера, который имеет отдельное логическое свойство «isCollapsed» для каждого элемента в коллекции:

{'title':'Item1','content':'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus maximus orci sodales, pellentesque urna eu', isCollapsed: true}

Если вам нужны какие-либо уточнения кода, просто спросите :)

person JDTLH9    schedule 17.04.2015
comment
это именно то, что я ищу. Большое спасибо :) - person user1153484; 20.04.2015