Question

我对CSS不好，到目前为止没有运气。出于某种原因，CSS样式不适用于.ngSelectionCheckbox和.ngSelectionHeader。

我正在尝试使用csscheckbox.com中的CSS，将类名从自述文件更改为我的，但没有运气。

这是我目前的表格： enter image description here

这就是我需要的样子： enter image description here

另外，我不知道如何将行的底部向上推，并将复选框与数字对齐。

非常感谢您的帮助。

Answer 1

好的，虽然我不打算为你量身定做整个事情，但检查方框的功能就像这样

HTML：

<body ng-app="TestApp">
    <div ng-controller="TestController">
        <table>
          <tr>
            <th></th>
            <th>CPT CODE/Service Provider;</th>
            <th>Average Cost</th>
            <th>Offered Price</th>
          </tr>
          <tr ng-repeat="row in data" ng-class="{'selected': row$index}">
              <td><input type="checkbox" ng-model="row$index" /></td>
              <td>{{row.code}}</td>
              <td>{{row.cost}}</td>
              <td>{{row.price}}</td>
          </tr>
        </table>
    </div>
</body>

CSS：

.selected {
    background-color:#ff00ff;
}

控制器：

var app = angular.module("TestApp",[]);

app.controller("TestController", function($scope)
{
    $scope.data = [
        {
            "code":"a",
            "cost": 11,
            "price": 10
        },
        {
            "code":"b",
            "cost": 21,
            "price": 20
        },
        {
            "code":"c",
            "cost": 31,
            "price": 30
        }
    ];
});

FIDDLE：http://jsfiddle.net/25NVD/

它的主旨是，使用ng-repeat制作行，使用ng-class分配所选的＆＃39;检查row$index时的课程。 $index是ng-repeat创建的计数，我曾用它制作一个独特的模型。

使用自定义css修改ng-grid复选框，修改空间

1 个答案: