Javascript 在ng中切换图标在angular js中重复

在下面的代码中，我试图为一系列区域显示加号[+]。当用户单击加号时，子区域显示在下面，加号变为减号[-]

区域显示正确，单击链接时，子区域显示正确。但是，我似乎无法让show/hide对加号和减号起作用，当用户单击减号再次折叠列表时，我需要隐藏子区域

<div ng-repeat="item1 in vm.Regions track by $index">
    {{item1}}
    <a ng-click="vm.expandIt(item1)">
        <span>[+]</span> 
        <span>[-]</span>
    </a>
    <input type="checkbox" />

    <div ng-if="vm.collapseId==item1" ng-repeat="item2 in vm.data | filter:{'Region':  item1}:true">
        {{item2.CCG}}<input type="checkbox" ng-model="item2.Selected" />
    </div>

</div>

---

谁能给我指一下正确的方向吗？

你可以这样做：

<a ng-click="vm.expandIt(item1)">
    <span>{{item1.label}}</span> 
</a>

---

其中

expanded

是项目1的状态。

您试图创建的被称为

手风琴。您可以找到许多已经创建的组件。另外，
ng click=“vm.expandIt（item1）
应该在
[+]
上，反之亦然，如果这是显示区域的条件：
ng if=“vm.collapseId==item1”
（我想只能打开一个区域），您可以尝试
expandIt
函数：
vm.collapseId=（vm.collapseId==item）？false:item；
如果已经设置为该值，则将替换该值是的，这很有帮助，谢谢各位..到达那里。将立即尝试答案。虽然这是一种方法，但只需将函数名称更新为
expandIt
，以隐藏错误的声音。我同意，我宁愿重命名
toggleItem
或其他影响展开和折叠操作都存在。我选择了答案中的第二个选项，因为我更喜欢将标记保留在文件中。感谢你们的帮助。非常感谢。很高兴它帮助了你们；）祝你们愉快！
<a ng-click="vm.expandIt(item1)">
    <span>{{item1.label}}</span> 
</a>

<a ng-click="vm.expandIt(item1)">
    <span ng-if="!item1.expanded">[+]</span> 
    <span ng-if="item1.expanded">[-]</span>
</a>