角加载后运行jQuery

Question

I'm trying to style a table that is rendered with ngRepeat based on JSON that is received using a service that uses $http.get .

The problem is that I have side headers and I want to do a border-left like in this picture, but I can't with CSS.

My code is here: http://embed.plnkr.co/V2E0rLJVVOgOlGLzmrER/preview

So I need to run jQuery to style the table with better selectors.

Note that the table is populated in a function inside a controller.

The problem is that I can't do: .frm-tr:first-child td{border-left: "solid"} , and inside the controller, after I get the data, I can't manipulate the DOM that is created inside the service .success function.

This returns nothing:

My controller

    $scope.dashTable = data.data;
    $(document).ready(function () {
        console.log($('.frm-tr'));
    });

My angular table

<table cellspacing='0' cellpadding="0" border="1" ng-repeat="table in dashTable" class="frm-quota-table">
<tbody>
    <tr class="frm-table-header" ng-repeat="header in table.Header">
        <th colspan="{{cell.ColSpan}}" ng-if="cell.Index !== 0" ng-repeat="cell in header.Cells" class="frm-headers clearfix" ng-class="{'border-left':cell.ColSpan === 1}">
            <div ng-if="cell.Text !== '' && cell.ColSpan !== 1" class="frm-table-line pull-left"></div>
            <div ng-class="{'pull-left cell-text': cell.Text !== '' && cell.ColSpan !== 1}">{{cell.Text}}</div>
            <div ng-if="cell.Text !== '' && cell.ColSpan !== 1" class="frm-table-line pull-right"></div>
        </th>
    </tr>
    <tr class="frm-tr" ng-repeat="content in table.Content">
        <th ng-if="th.RowSpan !== 1" rowspan="{{th.RowSpan}}" colspan="{{th.ColSpan}}" class="frm-side-header" ng-repeat="th in content.LeftPart">
            --&nbsp;{{th.Text}}&nbsp;--
        </th>
        <th ng-if="th.RowSpan === 1" rowspan="{{th.RowSpan}}" colspan="{{th.ColSpan}}" ng-repeat="th in content.LeftPart">
            {{th.Text}}
        </th>
        <td ng-repeat="td in content.ContentPart">
                {{td.Text}}
        </td>
    </tr>
</tbody>
</table>

Answer 1

After discussions with other developers in my team, we did it in angular in a different style:

Solution:

<td ng-repeat="(ndx, td) in content.ContentPart" ng-class="{'border-left-simple': ndx % 3 === 0}"> {{td.Text}} </td>