需要使用 angularjs 更改字形图标

Question

需要使用angularjs更改折叠面板的字形，下面是我试过的

<div class="panel-heading pan_hd1" ng-model="collapsed" ng-click="collapsed=!collapsed">
    Heading <span ng-class="{'glyphicon glyphicon-menu-down pull-right pan_arrow1': !isCollapsed, 'glyphicon glyphicon-menu-up pull-right pan_arrow1': isCollapsed}"></span>
</div>

请帮忙解决这个问题

Answer 1

您的变量名称不匹配。 class 的一个用途是 isCollapsed，ng-click 的一个变化是 collapsed。

它在 ng-model 中也可能是错误的，但老实说，我无法弄清楚您要在模型中保存什么。

<div class="panel-heading pan_hd1" ng-model="collapsed" ng-click="isCollapsed=!isCollapsed">Heading<span  ng-class="{'glyphicon glyphicon-menu-down pull-right pan_arrow1': !isCollapsed, 'glyphicon glyphicon-menu-up pull-right pan_arrow1': isCollapsed}"></span></div>

Working Fiddle

Answer 2

以下代码有效

<div class="panel-heading pan_hd1" ng-model="collapsed" ng-click="collapsed=!collapsed">Heading<span  ng-class="{'glyphicon glyphicon-menu-down pull-right pan_arrow1': !collapsed, 'glyphicon glyphicon-menu-up pull-right pan_arrow1': collapsed}"></span></div>

感谢您的帮助。

需要使用 angularjs 更改字形图标

Need to change the glyphicon using angularjs

html

angularjs

angular-ui-bootstrap