Как сохранить расширенные вкладки развернутыми и наоборот после server.update ()

Question

в моем приложении есть вкладки, которые пользователь может развернуть.Когда сервер обновляется, эти вкладки автоматически закрываются и их необходимо открыть, но я хочу, чтобы открытые вкладки оставались открытыми.Мне не удалось этого добиться, кто-нибудь может помочь?

Вот соответствующие HTML и JavaScript:

//Expand all relevant categories when they search
$scope.changeOfFilter = function() {
if($scope.filterSearch != '') {
  $scope.expand = true;
} else {
  $scope.expand = false;
}
}

//Server updates, after these occur the expanded should remain expanded, and vice-versa.
$scope.addOrModifySkill = function(skill, skillLevel, category) {
  c.data.skillToModify = skill;
  c.data.levelToModify = skillLevel;
  c.data.modifiedSkillCategory = category;

  c.server.update().then(function(response) {
    c.data.skillToModify = "";
    c.data.levelToModify = "";
    c.data.modifiedSkillCategory = "";
  })
  console.log("skill = ",skill,"\nskillLevel = ",skillLevel);
}

$scope.deleteSkill = function(skill, category) {
  c.data.skillToDelete = skill;
  c.data.categoryOfDeletedSkill = category;

  c.server.update().then(function(response) {
    c.data.skillToDelete = "";
    c.data.categoryOfDeletedSkill = "";
  })
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div>

<label id="search"><input placeholder=' &#xf002; search here...' ng-model="filterSearch" ng-init="filterSearch=''" ng-change="changeOfFilter()"></label>

<span ng-repeat="group in c.data.skillsAndCategories | filter:filterSearch">
  <span class="category-header btn btn-default btn-sm btn-block" ng-click="expand = !expand">
    <span ng-class="{'glyphicon glyphicon-triangle-bottom pull-right': !expand, 'glyphicon glyphicon-triangle-top pull-right': expand}"></span>
    {{group.category}}<br/>
  </span>

  <span ng-if="skill.toLowerCase().includes(filterSearch.toLowerCase()) || group.category.toLowerCase().includes(filterSearch.toLowerCase()) || filterSearch==''" ng-show="expand" ng-repeat="skill in group.skills">
    <span class="skills btn btn-default btn-xs btn-block"> 
      {{skill}} 

      <span style="font-size: 1.5rem;" ng-if="group.category != 'Accreditation'">
        <i class="fa fa-circle skill-icon pull-right" ng-click="addOrModifySkill(skill,'4',group.category)" ng-class="{expert: checkSkillLevel(skill) >= 4}" ng-attr-title="Expert at {{skill}}"></i>
        <i class="fa fa-circle skill-icon pull-right" ng-click="addOrModifySkill(skill,'3',group.category)" ng-class="{competent: checkSkillLevel(skill) >= 3}" ng-attr-title="Competent at {{skill}}"></i>
        <i class="fa fa-circle skill-icon pull-right" ng-click="addOrModifySkill(skill,'2',group.category)" ng-class="{workingknowledge: checkSkillLevel(skill) >= 2}" ng-attr-title="Working knowledge of {{skill}}"></i>
        <i class="fa fa-circle skill-icon pull-right" ng-click="addOrModifySkill(skill,'1',group.category)" ng-class="{learning: checkSkillLevel(skill) >= 1}" ng-attr-title="Learning {{skill}}"></i>
        <i class="fa fa-circle skill-icon pull-right" ng-click="addOrModifySkill(skill,'0',group.category)" ng-class="{none: checkSkillLevel(skill) >= 0}" ng-attr-title="None for {{skill}}"></i>
      </span>

      <button ng-if="checkSkillLevel(skill) >= 0" type="button" class="close pull-right" aria-label="Close" ng-click="deleteSkill(skill,group.category)" ng-attr-title="Remove {{skill}} from your skills">
        <span aria-hidden="true">&times;</span>
      </button>
    </span>
  </span>

</span>
</div>

Спасибо за любую помощь.