2015-09-09 2 views
0

Я перечисляю некоторые изображения с помощью ng-repeat и хочу применить псевдо-класс с некоторым контентом после него.Псевдоэлементы CSS не работают с 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'] 
}]); 

Однако псевдо-класс не будет работать. Это очень странно.

ответ

2

его не о материи углового ng-repeat

просто проверить <img /> без угловых и проверить с ::before

как

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

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

ее не работает из-за большинство браузеров не поддерживает ::before , ::after на img элементы

check this

+0

Wowwwww Я боролся с этим куском дерьма в течение часа и половины, а затем взял обед. Спасибо человеку, что вы спасли мне такую ​​головную боль !! – Noitidart

+1

ах :) рад слышать этот cheerz :) –

Смежные вопросы