我正在使用AngularJs,Bootstrap 3.我想在我的页面上切换我的glyphicon图标。但我能够做到。我在stackoverflow问题here处跟踪了响应。 我不明白为什么我不能用toggle表达式显示glyphicon。
这是我的代码:
<script>
angular.module("myapp", [])
.controller("MyController", function($scope) {
$scope.toggleIcon = false;
$scope.sort = function (sortBy) {
$scope.toggleIcon = !$scope.toggleIcon;
// sorting logic
};
} );
</script>
</head>
<body ng-app="myapp">
<div ng-controller="MyController" >
<div class="row">
Here the name to sort
<a href="" ng-click="sort('name')">Name </a><span class="glyphicon" ng-class="{glyphicon-sort-by-alphabet': toggleIcon, 'glyphicon-sort-by-alphabet-alt': !toggleIcon}"></span>
</div>
<div class="row">
Here the icon
<a href=""><span class="glyphicon glyphicon-sort-by-alphabet"></span></a>
</div>
</div>
</body>
</html>
您可以在Plunker
上查看代码谢谢。