javascript - 关于ng-repeat，获取DOM渲染完后的元素出现问题？

Question

我用ng-repeat渲染出数据后，想修改某一个指定的DOM元素的样式，下面是示例代码

    <ul ng-repeat="item in city" repeat-done="cityFinish()">
        <li class="city city{{$index}}">{{item}}</li>
    </ul>

    $scope.cityFinish = function() {
        $('.city').css('background', 'red');
        $('.city1').css('background', 'green');
    };

其中 $('.city').css('background', 'red');有效，但是$('.city1').css('background', 'green');无效，这是什么原因？

Answer 1

我项目尝试是可以的 ， city{{$index}}是从city0可以 你可以审查元素看下class是否变为city1 ，然后可以试着断点$('.city1')是否取到了dom元素

Answer 2

你先审查一下元素。确保它的 class 是对的。
首先，不知道你的 repeat-done 是如何写的。这应该不是 angularjs 自带的。repeat-done 是如何写的。这应该不是 angularjs 自带的。
其次，为什么不把颜色写到 css 中，然后用 ng-class 或者 ng-style其次，为什么不把颜色写到 css 中，然后用 ng-class 或者 ng-style 处理，一定要用 jQuery 呢。

你的需求是不是，除了 index 为 1 的背景色为绿色，其他的都为红色？

<ul ng-repeat="(index, item) in city">
  <li class="bg-red" ng-class="{'bg-green': $index == 1}">{{item}}</li>
</ul>

.bg-red {
  background: 'red';
}

.bg-green {
  background: 'green';
}

能不用 jQuery 就别用，更何况你还有内置的 jqLite 可以用。。。jQuery 作为第三方库，如果你不针对 angularjs 封装，那么你不能保证它的执行一定是在生成节点之后的，特别是对于 custom directive。