Use data attribute value as value in sass variable [duplicate]

Question

I have json adding data attributes and would like to use the value of the data attribute to control the width of elements.

My sass compiler is complaining though.

 <li class="lecture"  data-views="190"></li>

 $popularity: [data-views]

  .og-grid li > a,
  .og-grid li > a img
      width: $popularity

Answer 1

I don't think you can get DOM data attributes with SASS that way. You could use a class instead for each value, obviously if there are too many this is not ideal:

CSS Class solution:

.lecture[data-views='190']{
  width: 190px;
}

An Alternative could also be jQuery:

$('.lecture').each(function(i){
     $(this).width($(this).data('views'));
});