在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>

感谢您的帮助。