Question

当我点击手风琴并设置活动手风琴的颜色时，我想通过glyphicon glyphicon-minus更改glyphicon glyphicon-plus。请问我的问题。

page.chtml：

 <accordion>
    <spotcam class="accordion" data-ng-repeat="spot in Spots" title="{{spot.title}}">                  @Html.Partial("~/Views/Common/ConfigurationTemplateDefault.cshtml")
   </spotcam>
 </accordion>

控制器：

 .directive('accordion', function () {
          return {
              restrict: 'EA',
              replace: true,
              transclude: true,
              template: '<div data-ng-transclude=""></div>',
              controller: function () {
                  var Spots = [];
                  this.Open = function (selected_Spot) {
                      angular.forEach(Spots, function (Spot) {
                          if (selected_Spot != Spot)
                              Spot.showMe = false;
                      });
                  };
                  this.addSpot = function (Spot) {
                     Spots.push(Spot);
                  };
              }
          };
      })
      .directive('spotcam', function () {
                return {
                    restrict: 'EA',
                    replace: true,
                    transclude: true,
                    require: '^accordion',
                    scope: { title: '@' },
                    template: '<div>' +
                                '<div class="title"><a class=" more-less glyphicon glyphicon-plus" ng-class="{ 'glyphicon glyphicon-plus': spot != 'selected_Spot', 'glyphicon glyphicon-minus' : spot == 'selected_Spot' }"  data-ng-click="toggle()"></a>{{title}}</div>' +
                                '<div class="body" data-ng-show="showMe" data-ng-transclude=""></div>'+
                                '</div>',
                    link: function (scope, element, attrs, accordionController) {
                        scope.showMe = false;
                        accordionController.addSpot(scope);
                        scope.toggle = function () {
                            scope.showMe = !scope.showMe;

                            accordionController.Open(scope);
                        };
                    }
                }
            });

Answer 1

一种选择是在表达式

中使用范围变量showMe

template: '<div>' +
            '<div class="title"><a class=" more-less glyphicon glyphicon-plus" ng-class="{true: \'glyphicon glyphicon-minus\', false:\'glyphicon glyphicon-plus\'}[showMe]"  data-ng-click="toggle()"></a>{{title}}</div>' +
            '<div class="body" data-ng-show="showMe" data-ng-transclude=""></div>'+
            '</div>',

Angular JS：当我点击手风琴时我怎么能改变glyphicon

1 个答案: