在转发器中绑定 class

Question

这是我的 html

<span class="" ng-repeat="font in model.fonts" >
    <a ng-click="model.value.HeadingFont = font" href="javascript:void(0);" ng-class="[font-bulb, {active: font==model.value.HeadingFont}]" style="font-family:{{font}};">Aa</a>
</span>

并在控制器中

$scope.model.fonts = ["'Raleway', sans-serif", "'Open Sans', sans-serif", "'Oswald', sans-serif", "'Crimson+Text', sans-serif", "'Roboto', sans-serif"];

我想做的是在数组中显示一个 link foreach 字体。单击该值应设置为 $scope.model.value.HeadingFont 并且 link 应具有 css 类 "font-bulb"（始终）和 "active" 如果 $scope.model.value.HeadingFont == {currentFont}

值设置正确，但css 类不适用；我尝试了不同的选项，但找不到正确的选项。

有人可以帮忙吗？

谢谢

Answer 1

你可以简单地像下面这样，将 class="font-bulb" 放在外面，然后剩余的条件添加 class 逻辑将转到 ng-class 指令。

标记

<span class="" ng-repeat="font in model.fonts" >
  <a ng-click="model.value.HeadingFont = font" href="javascript:void(0);" class="font-bulb"
   ng-class="{active: font==model.value.HeadingFont}" style="font-family:{{font}};">
      Aa
  </a>
</span>

在转发器中绑定 class

Binding class in a repeater

angularjs

ng-repeat

angularjs-ng-repeat

ng-class

angularjs-ng-class