CSS伪元素不适用于ng-repeat?

时间:2015-09-09 04:52:42

标签: angularjs pseudo-element

我列出了一些带有ng-repeat的图像,并希望在其后应用一些含有一些内容的伪类。

这是我的小提琴:https://jsfiddle.net/Noitidart/y7dxa6n8/11/

以下是代码:

<style>
    body {background-color:steelblue;}
    img::after { content: 'rawr'; size:100px; color:red; }
</style>
<div ng-app="myApp">
  <div ng-controller="MyController as mc">
    <img ng-repeat="aSrc in mc.arr" ng-src="{{aSrc}}"/>
  </div>
</div>

控制器:

var myApp = angular.module('myApp', ['ngCookies']);

myApp.controller('MyController', [function($cookie) {
           this.arr = ['https://jsfiddle.net/img/logo.png']
}]);

然而伪类不会工作。这很奇怪。

1 个答案:

答案 0 :(得分:3)

它不是角度问题ng-repeat

只需检查<img />没有角度,然后查看::before

<img src="https://jsfiddle.net/img/logo.png">

img::after { content: 'rawr'; size:100px; color:red; }

由于大多数浏览器不支持::before ::after img元素

,因此无效

检查this