class - 寻找一个应用背景颜色的简单角度类指令

Question

我有一个模态屏幕，一个 ng-repeat 显示一个带有 ng-model 的复选框列表。我发现 ng-modal 使复选框显示绿色边框。

        <div class="modal-body">
        <span ng-repeat="ptField in myForm.fieldsFromType" ng-hide="getFieldIndex(ptField.name) != -1">
            <label class="checkbox" for="{{item.id}}">
                <input type="checkbox" ng-model="ptField.checked" id="{{item.id}}"> {{ptField.label}}
            </label>
        </span>
    </div>

我为复选框背景颜色添加了一个样式：#FFFFFF; 这删除了绿色边框。

我想构建一个非常简单的指令，用于所有显示绿色边框的复选框。最好的方法是什么？

Answer 1

不需要指令。

.modal-body input[type='checkbox'] {
  background-color: #FFF;
}

除非您在问题中指的是“ng-model”而不是“ng-modal”，在这种情况下：

input[type='checkbox'][ng-model] {
  background-color: #FFF;
}

Answer 2

如果您出于某种原因必须使用指令，而不是 CSS 类，那么您可以这样做。

.directive('checkbox', function () {
  return {
    restrict: 'A',
    link: function (scope, elem, attrs) {
      var color = "red";
      elem.css({"background-color":color});
    }
  }
});