emberjs / list-view

An incremental rendering list view for Ember.js
MIT License
465 stars 116 forks source link

How to add a class to a list item element #228

Closed marcemira closed 6 years ago

marcemira commented 9 years ago

I need to add a class (i.e. 'myClass') to the list item at current 0.6 :

{{#ember-list height=100  items=model.items width=100 rowHeight=20}}
  Hello
{{/ember-list}}

and produce (notice the 'myClass' in the list-item):

<div id="ember890" class="ember-view ember-list-view ember-list-view-list" style="height:559px;position:relative;overflow:auto;-webkit-overflow-scrolling:touch;overflow-scrolling:touch;">
  <div class="ember-list-container" style="height: 2020px;">
    <div id="ember895" class="ember-view ember-list-item-view myClass" style="transform: translate(0px, 600px)"> Hello </div>
  </div>
</div>

How can I achieve this? Thanks!

stefanpenner commented 9 years ago

you must add an addition element within the row to have bound classes.

{{#ember-list height=100  items=model.items width=100 rowHeight=20}}
  <div class="{{myClass}}">
    Hello
  </div>
{{/ember-list}}
stefanpenner commented 9 years ago

we may open up support to the inner row in the future, but at the time, due to an issue in ember we could enable this.

marcemira commented 9 years ago

:+1: Thanks Stef

stefanpenner commented 9 years ago

likely something we need to address in the docs.

rwjblue commented 6 years ago

I'm sorry we didn't get back to this previously, but at this point this repo is essentially unmaintained. Please use @html-next/vertical-collection or ember-collection for similar functionality.

Closing...